zoukankan      html  css  js  c++  java
  • 【jQuery基础学习】07 jQuery表单插件-Form

    作用: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的类型来返回相应格式的内容
            //对于缺省值:返回的是XMLHttpRequest对象的responseXML属性
        },
        url:url,            //默认为form的action,如果申明,就用url
        type:type,            //默认为form的method(post或get),如果申明,就覆盖
        dataType:null,        //服务端返回的类型
        clearForm:true,        //成功提交后,清除所有表单元素的值
        resetForm:true,        //成功提交后,重置所有表单元素的值
        timeout:3000        //限制请求的超时时间,大于3秒,跳出请求
    }
    $("myForm").ajaxForm(options);
  • 相关阅读:
    HDU 2095 find your present (2) (异或)
    UESTC 486 Good Morning (水题+坑!)
    UVa 111 History Grading (简单DP,LIS或LCS)
    UVa 11292 Dragon of Loowater (水题,排序)
    HDU 1503 Advanced Fruits (LCS+DP+递归)
    UVa 10881 Piotr's Ants (等价变换)
    UVa 11178 Morley's Theorem (几何问题)
    HDU 1285 确定比赛名次(拓扑排序)
    .net Core的例子
    TCP与UDP的区别
  • 原文地址:https://www.cnblogs.com/vvjiang/p/5178523.html
Copyright © 2011-2022 走看看