"."/> ".">
cari

Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Apakah itu jquery.form.js

Apakah itu jquery.form.js

藏色散人
藏色散人asal
2021-11-11 10:51:371729semak imbas

jquery.form.js ialah pemalam borang yang menyokong penyerahan borang ajax dan muat naik fail ajax. Kaedah rujukannya adalah seperti "f4fe8c00970c54ec7ffad3a9e6afa740468f52ab7eafe7671657f3ec4396e87b".

Apakah itu jquery.form.js

Persekitaran pengendalian artikel ini: sistem windows7, versi jquery 1.6.2, komputer DELL G3

Apakah itu jquery. form.js?

jQuery.form.js menggunakan

jQuery.form.js ialah pemalam borang yang menyokong penyerahan borang ajax dan muat naik fail ajax. 

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Scripts/jquery-1.6.2.js"></script>
    <script src="~/Scripts/jQuery.form.js"></script>
</head>
<body>
    <div>
        <form id="ajaxForm" method="post" action="/Home/Index" enctype="multipart/form-data">
            <input type="text" name="name" />
            <input type="text" name="sex" />
            <input type="file" name="file" />
            <button type="submit" id="btnSubmit">提交1</button>
        </form>
        <button id="btnButton" type="button">提交2</button>
    </div>
    <script type="text/javascript">
        $(function () {
            $("#ajaxForm").ajaxForm(function () {
                alert("提交成功1");
            });
            $("#ajaxForm").submit(function () {
                $(this).ajaxSubmit(function () {
                    alert("提交成功1");
                });
                return false;
            });
            $("#btnButton").click(function () {
                $("#ajaxForm").ajaxSubmit(function () {
                    alert("提交成功2");
                });
                return false;
            });
        });
    </script>
</body>
</html>
ajaxForm Tambah semua pendengar acara yang diperlukan untuk bersedia untuk penyerahan borang ajax . ajaxForm tidak boleh menyerahkan borang. Dalam fungsi sedia dokumen, gunakan ajaxForm untuk menyediakan penyerahan ajax borang. Menerima 0 atau 1 parameter. Parameter boleh menjadi fungsi panggil balik atau objek Pilihan. $("#formid").ajaxForm();
ajaxSubmit Gunakan ajax untuk menyerahkan borang. Menerima 0 atau 1 parameter. Parameter boleh menjadi fungsi panggil balik atau objek Pilihan.
ajaxForm 增加所有需要的事件监听器，为ajax提交表单做准备。ajaxForm并不能提交表单。在document的ready函数中，使用ajaxForm来为ajax提交表单进行准备。 接受0个或1个参数。参数可以是一个回调函数，也可以是一个Options对象。 $("#formid").ajaxForm();
ajaxSubmit 使用ajax提交表单。 接受0个或1个参数。参数可以是一个回调函数，也可以是一个Options对象。

$("#formid").ajaxSubmit();

或

$("#formid").submit(function(){

    $(this).ajaxSubmit();

    return false;

});
formSerialize 将表单串行化（或序列化）为一个查询字符串。这个方法将返回以下格式的字符串：name1=value1&name2=value2。 无 $("#formid").formSerialize();
fieldSerialize 将表单的字段元素串行化（或序列化）为一个查询字符串。当只有部分表单字段需要进行串行化（或序列化）时，使用这个就很方便了。返回以下格式的字符串：name=value1&name2=value2。 无 $("#formid .specialFields").fieldSerialize();
fieldValue 返回匹配插入数组中的表单元素值。该方法以数组的形式返回数据。如果元素值被判定可能无效，则数组为空。 无 $("#formid :password").fieldValue();
resetForm 将表单恢复到初始状态。 无 $("#formid").resetForm();
clearForm 清除表单元素。该方法将所有的text、password、textarea置空，清除select元素中的选定，以及所有radio按钮和checkbox按钮重置为非选定状态。 无 $("#formid").clearForm();
clearFields 清除字段元素。只有部分表单元素需要清除时方便使用。 无 $("#formid .specialFields").clearFields();
$("#formid").ajaxSubmit();

or

$("#formid").submit(function(){
target 指明页面中由服务器响应进行更新的元素。元素的值可能被指定为一个jQuery选择器字符串、一个jquery对象、一个DOM元素。 默认值：null
url 指定提交表单数据的URL。 默认值：表单的action属性值
type 指定提交表单数据的方法（method）：“GET”或“POST”。 默认值：GET
beforeSubmit 表单提交前被调用的回调函数。如果回调函数返回false表单将不被提交。回调函数带三个调用参数：数组形式的表单数据，jQuery表单对象，以及传入ajaxForm/ajaxSubmit中的Options对象。 默认值：null
success 表单成功提交后调用的回调函数。然后dataType选项值决定传回responseText还是responseXML的值。 默认值：null
dataType 返回的数据类型：null、"xml"、"script"、"json"其中之一。 默认值：null
resetForm 表示如果表单提交成功是否进行重置。 默认值：null
clearForm 表示如果表单提交成功是否清除表单数据。 
var options={
    target : &#39;#output&#39;,    // 把服务器返回的内容放入id为output的元素中
    beforeSubmit : showRequest,    // 提交前的回调函数
    success : showResponse,    // 提交后的回调函数
    // url : url,    //默认是form的action，如果申明，则会覆盖
    // type : type,    // 默认值是form的method("GET" or "POST")，如果声明，则会覆盖
    // dataType : null,    // html（默认）、xml、script、json接受服务器端返回的类型
    // clearForm : true,    // 成功提交后，清除所有表单元素的值
    // resetForm : true,    // 成功提交后，重置所有表单元素的值
    timeout : 3000    // 限制请求的时间，当请求大于3秒后，跳出请求
}
function showRequest(formData, jqForm, options){
    // formData: 数组对象，提交表单时，form插件会以ajax方式自动提交这些数据，格式如[{name:user,value:val},{name:pwd,value:pwd}]
    // jqForm: jQuery对象，封装了表单的元素
    // options: options对象
    var queryString=$.param(formData); // name=1&address=2
    var formElement=jqForm[0]; // 将jqForm转换为DOM对象
    var address=formElement.address.value; // 访问jqForm的DOM元素
    return true; // 只要不返回false，表单都会提交，在这里可以对表单元素进行验证
}
function showResponse(responseText,statusText){
    // dataType=xml
    var name=$("name",responseXML).text();
    var address=$("address",responseXML).text();
    $("#xmlout").html(name+" "+address);
    // dataType=json
    $("#jsonout").html(data.name+" "+data.address);
}
$(this).ajaxSubmit();

return false;

});
formSerialize Sirikan (atau sirikan) borang ke dalam rentetan pertanyaan. Kaedah ini akan mengembalikan rentetan dalam format berikut: name1=value1&name2=value2. Tiada $("#formid").formSerialize();
fieldSerialize akan Elemen medan borang bersiri (atau bersiri) ke dalam rentetan pertanyaan. Ini mudah apabila hanya beberapa medan borang yang perlu disiri (atau bersiri). Mengembalikan rentetan dalam format berikut: name=value1&name2=value2. Tiada $("#formid .specialFields").fieldSerialize();
fieldValue Mengembalikan nilai elemen borang yang sepadan dengan sisipan ke dalam tatasusunan. Kaedah ini mengembalikan data dalam bentuk tatasusunan. Jika nilai elemen ditentukan berkemungkinan tidak sah, tatasusunan adalah kosong. Tiada $("#formid :password").fieldValue();
resetForm Pulihkan borang kepada keadaan asal. Tiada $("#formid").resetForm();
clearForm Clear Elemen bentuk. Kaedah ini akan mengosongkan semua teks, kata laluan dan kawasan teks, mengosongkan pemilihan dalam elemen pilih dan menetapkan semula semua butang radio dan butang kotak semak kepada keadaan tidak dipilih. Tiada $("#formid").clearForm();
clearFields Kosongkan elemen medan. Mudah apabila hanya beberapa elemen bentuk perlu dikosongkan. Tiada $("#formid .specialFields").clearFields();
Objek pilihan Kedua-dua ajaxForm dan ajaxSubmit menyokong banyak parameter pilihan, yang boleh disediakan menggunakan objek Pilihan. Pembelajaran yang disyorkan: "tutorial video jquery"

Atas ialah kandungan terperinci Apakah itu jquery.form.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：jquery lt apa maksudnyaArtikel seterusnya：jquery lt apa maksudnya

Artikel berkaitan

Lihat lagi