你的位置:首页 > Java教程

[Java教程]【jQuery基础学习】07 jQuery表单插件


作用:jQuery Form插件的作用是为了让我们可以很方便地用ajax的方式提交表单,从而使我们提交表单的时候页面不用进行刷新。

它的核心方法是ajaxForm()和ajaxSubmit()

升级表单提交方式的时候很简单,不用去改变HTML结构,如下即可:

  //就是下面这么简单  $("#myForm").ajaxForm(function(){    //提交成功后的操作  });  //你也可以这样  $("#myform").submit(function(){    $(this).ajaxSubmit(function(){      //提交成功后的操作    });    return false;//阻止表单默认提交  });

提交表单的时候不仅可以像上面的例子那样,给ajaxForm和ajaxSubmit传递一个回调函数,还可以传递一个options对象。

定义了一个options如下:

var options={  target:"#output1",//把服务器返回的内容放入id为output1的元素中  beforeSubmit:function(formData,jqForm,options){//提交前的回调函数    //formData为数组对象,即提交的数据    //jqForm是一个jQuery对象,封装了表单元素    //options就是options对象    //在这个回调函数里,返回false会阻止表单提交  }  success:function(responseText,statusText,xhr,$form){//提交后的回调函数    //statusText是返回状态,值为success和error等    //responseText携带服务器返回的的数据内容。    //会根据datatype的类型来返回相应格式的内容    //对于缺省值:返回的是  },  url:url,      //默认为form的action,如果申明,就用url  type:type,      //默认为form的method(post或get),如果申明,就覆盖  dataType:null,    //服务端返回的类型  clearForm:true,    //成功提交后,清除所有表单元素的值  resetForm:true,    //成功提交后,重置所有表单元素的值  timeout:3000    //限制请求的超时时间,大于3秒,跳出请求}$("myForm").ajaxForm(options);