这里可以看到includeProperties里所配置的外面一层json，success和resultMSG。这在实际中很好用。如果服务器中没有取得需要的值，虽然ajax访问成功，但是获得的结果并不算成功，因为没有取得需要的值。这里加入了success标示，方便前台jQuery操作。

基于其他方法获取服务器数据从写法上与get基本一致，如post方法、load方法。这里就不再赘述了。

3.动态提交表单

通过jQuery的AJAX支持，可以让我们很方便的动态提交表单而不用刷新页面。

如下面例子：

$('#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和事件