在《jQuery入门学习一》中,我们很容易发现这种方法的关键几步其实只需要几行代码,大量的代码都用于处理跨浏览器操作,而处理这种问题的方法是很固定的,因此可以抽出来封装一下,从而实现代码复用和更简洁的代码。

此外,有很多操作,如document.getElementById()等是经常要用到的,如果每次都输入这么长的代码,将使得我们的工作效率不是很高,因此人们就对这种操作作一个封装,使得代码更简洁。

我想上面的这些JavaScript可以改进的方面就是人们想去做一些JS框架的原始想法。随着一些框架的产生,人们发现如果对JavaScript进行一些封装的话,也可以使用类似面向对象的方式来编写JavaScript代码,于是,更强大而又更复杂的框架产生了,jQuery就是其中之一。

 

使用jQuery实现异步登录验证的步骤:

  • 1.获取文本框中的内容

//Jquery的查找节点的方式,参数中#加上id属性值可以找到一个节点。 //jquery的方法返回的都是jquery的对象,可以继续在上面执行其他的jquery方法 var jqueryObj = $("#userName"); //获取节点的值 var userName = jqueryObj.val();

  • 2.发送异步验证请求

//使用jquery的XMLHTTPrequest对象get请求的封装 $.get("AJAXServer?name=" + userName,null,callback);

  • 3.回调函数

//回调函数 function callback(data) { //3.接收服务器端返回的数据 //4.将服务器段返回的数据动态的显示在页面上 //找到保存结果信息的节点 var resultObj = $("#result"); //动态的改变页面中div节点中的内容 resultObj.html(data); }

  • $.get(String url, Map data, Function callback

 jQuery.get( String url, Map data, Function callback ) returns XMLHttpRequest

与$.ajax()方法相比,这种方法更为简单,因为它用了几个默认参数,$.ajax()方法则更加灵活,当然它用的参数也更多一些。它的一个重要特点是不论操作是否成功只有一个callback函数,而$.ajax()方法则可以根据返回的结果是否成功来用两个不同的函数来处理。

例子:

Example:
Request the test.php page, but ignore the return results.
 $.get("test.php");
Example:
Request the test.php page and send some additional data along (while still ignoring the return results).
 $.get("test.php", { name: "John", time: "2pm" } );
Example:
Alert out the results from requesting test.php (HTML or XML, depending on what was returned).
 $.get("test.php", function(data){ 
   alert("Data Loaded: " + data); 
 });
Example:
Alert out the results from requesting test.cgi with an additional payload of data (HTML or XML, depending on what was returned).
 $.get("test.cgi", { name: "John", time: "2pm" }, 
   function(data){ 
     alert("Data Loaded: " + data); 
   });