如下面例子：

$('#letter-f form').submit(function(){ //调用preventDefault方法阻止事件冒泡，具体工作就是如果网页有脚本错误，那么则会阻止提交form表单 event.preventDefault(); var formValues = $('input[id="term"]').val(); var requestStr = {'term':formValues.toUpperCase()}; $.get('EGet.action', requestStr, function(data){ var responseObj = $.parseJSON(data); if(responseObj.success == 'true') { var html = ''; var dataObj = $.parseJSON(responseObj.resultMSG); html += "<div>"; html += "<h3>" + dataObj.term + "</h3>"; html += "<div>" + dataObj.part + "</div>"; html += "<div>"; html += dataObj.definition; if(dataObj.quote){ html += '<div class="quote">'; $.each(dataObj.quote, function(lineIndex, line){ html += '<div class="quote-line">' + line + '</div>'; }); if(dataObj.author){ html += '<div class="quote-author">' + dataObj.author + '</div>'; } } html += "</div>"; html += "</div>"; $('#dictionary').html(html); } else{ var warning = $('Sorry, your term was not found!'); $('#dictionary').html(warning); } }); });这个例子援引的数据还是上一个EGet.action所用的那个数据。程序的操作过程基本是： 首先调用这个 preventDefault();这个方法在注释里也说明了，用于阻止事件冒泡带来的不便与麻烦。

接下来通过$()获得input的元素，使用val方法获得其值，接下来的使用方法与上例基本相同。

这里也可以使用serialize方法将input元素序列化成如下格式“term=xxx”这样。不过由于服务器端的java程序中的那些数据时硬编码的，所有，不是太方便用，就没用。

4.关于Ajax的观察员函数

jQuery包含了2个全局的ajax观察员函数：ajaxStart和ajaxStop。

分别在执行ajax操作的起始和结束时调用。例如：

//ajax的观察员函数 ajaxStart 和 ajaxStop $('<div id="loading">Loading...</div>').insertBefore('#dictionary') .ajaxStart(function(){ $(this).show(); }).ajaxStop(function(){ $(this).hide(); });这里无论哪个a标签触发ajax操作，包括静态载入文件和动态服务器访问，都会触发ajaxStart和ajaxStop。

关于错误处理，常用的三个函数：success、complete、error。

下面以error为例：

.error(function(jqXHR){ $('#dictionary').html('An Error occurred:'+ jqXHR.status).append(jqXHR.responseText); });可以以连缀的写法将error方法放置于get方法之后：“$.get().error()”这样。

刚才看了一下，这个可以将Tomcat的报错，加载到页面之上。这在有的时候还是很有用的。如图：

不过不知道为何这个将我原有样式也覆盖了一些，如果有哪位网友知道，麻烦指正一下问题所在。谢谢了。

5.Ajax和事件

Ajax动态访问服务器以后生成的元素，如果想绑定事件的话，一种方法是每次取到都重新绑定处理程序，这种相对来说比较简单，但是不适合DOM结构经常变化的场景。如果DOM结构经常变化，那么就需要用live方法，实现事件委托。

live用法与bind一样。

版权声明：本文为博主原创文章，未经博主允许不得转载。