ホームページ >ウェブフロントエンド >フロントエンドQ&A >jqueryフォームで使用されるメソッドは何ですか

jqueryフォームで使用されるメソッドは何ですか

WBOY
WBOYオリジナル
2022-06-07 15:24:102734ブラウズ

jquery では、ajaxForm() メソッドと ajaxSubmit() メソッドを使用して「jquery form」を使用できます。「jquery form」は、フォームを送信するために使用される非同期フォーム送信用のプラグインであり、フォームの送信時間を設定します。フォームを送信する前にフォーム データを検証して処理し、フォームの送信後に関数を呼び出すことができるパラメーター。

jqueryフォームで使用されるメソッドは何ですか

このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。

jquery formの使い方

jquery formはフォームの非同期送信用のプラグインで、簡単にフォームの送信、フォーム送信用のパラメータの設定、送信前のフォームデータのチェックサムを行うことができます。フォーム処理およびフォーム送信後の関数呼び出し。

このプラグインには、

ajaxForm() と ajaxSubmit() という 2 つの主要なメソッドがあります。

これらは、フォーム要素の制御から決定まですべてを統合します。送信プロセスを管理する関数;

0 または 1 つのパラメータを受け入れることができ、パラメータは関数または json 形式に似た JS オブジェクトにすることができます;

ajaxForm() はできませんフォームを送信します。フォーム送信の準備をします:

1: 関数

$("#form1").submit(function () {
    $('#form1').ajaxForm(function () {
        alert("提交成功2")
    })
})

を渡します。しかし、このように書かれた多くのブログを読みましたが、実際のコードを実行すると、「送信は成功しました」と表示されました。 2" は印刷されませんでした。つまり、関数が入力されていません。

送信後、ページはアクションのアドレスにジャンプします。つまり、このメソッドはフォームの非同期送信を実装できません。フォーム送信の準備だけですが、受信A関数メソッドはこのメソッドには適していません、入力していないので書き方が間違っているのかわかりません。ただし、渡されたオプションがオブジェクトの場合は有効になります。

var options = {
    url: "/day09/jqueryFormServlet", //提交地址:默认是form的action,如果申明,则会覆盖
    type: "post",   //默认是form的method(get or post),如果申明,则会覆盖
    beforeSubmit: beforeCheck, //提交前的回调函数
    success: successfun,  //提交成功后的回调函数
    target: "#output",  //把服务器返回的内容放入id为output的元素中
    dataType: "json", //html(默认), xml, script, json...接受服务端返回的类型
    clearForm: true,  //成功提交后,是否清除所有表单元素的值
    resetForm: true,  //成功提交后,是否重置所有表单元素的值
    timeout: 3000     //限制请求的时间,当请求大于3秒后,跳出请求
};

2: js オブジェクトを渡します

$('#form1').ajaxForm(options)

ajaxSubmit() メソッド: フォームの非同期送信を実装します

$("#form1").submit(function () {
    $('#form1').ajaxSubmit(function () {
        alert("提交成功2")
    })
    return false;
})

ここでは false を返す必要があります。そうでない場合、フォームは送信されます非同期で 1 回送信されるため、デフォルトで 1 回送信されます;

$('#form1').ajaxSubmit(options)

ただし、オプション オブジェクトが渡された場合、1 回だけ送信されます

ビデオ チュートリアルの推奨事項: jQuery ビデオ チュートリアル

以上がjqueryフォームで使用されるメソッドは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。