ホームページ > 記事 > ウェブフロントエンド > Ajax_jquery を介して Form フォームを送信する Jquery の具体的な実装

Ajax_jquery を介して Form フォームを送信する Jquery の具体的な実装

WBOYオリジナル: 2016-05-16 17:16:561146ブラウズ

今日、たまたま Jquery のサーバーにデータを送信する ajax メソッドを見ました。原文は次のとおりです。

データをサーバーに保存し、成功したら情報を表示します。
jQuery コード:

コードをコピーコードは次のとおりです:

 
$.ajax ({ 
type: "POST", 
url: "some.php", 
data: "name=John&location=Boston", 
success: function(msg){ 
alert( "Data Saved : " msg ); 
} 
}); 

そこで考えたのですが、フォームをすべて入力することはできません。
その後、今日は .map というメソッドを見つけて、そこから学ぶことができます。
HTML コードは次のとおりです。次に、dlg_form のフォーム ID を持つすべての入力データを送信したいと思います。

コードをコピーしますコードは次のとおりです:

房间:

建設:

部门:

<フィールドセット>

空调制御器
凡例>

端口:

地址:

操作方法:

否か使用:

<フィールドセット>

灯光制御器
凡例>

端口:

地址:

操作方法:

否か使用:

>
取り付け完了总表:

总表電気能节点:

是不是很多,如果要你每入力都写的话,是不是要吐血?
看看我的方法、第一次我们すべての入力の名前と値都取下来、
js代码如下:

复制代码代码如下:

 
var str_data=$("#dlg_form input").map(function(){ 
return ($(this).attr("name ") '=' $(this).val()); 
}).get().join("&") ; 
アラート(データ); 

ps:你alert一下,你会発行现,此処面的架构就是divname=xxx&divname2=xxxx等等,

その後回头看看ajax提交的:

复制代码代码如下:

 
$.ajax({ 
type: "POST", 
url: "some.php", 
data: "name=John&location=Boston", 
success: function (msg){ 
alert( "Data Saved: " msg ); 

 
上記で得たものはありましたか? 、データを入力するだけですか?

変更後の完全なコードは、

コードをコピーしますコードは次のとおりです:

$.ajax({

var str_data=$("#dlg_form input").map(function(){ 
return ($( this).attr( "name") '=' $(this).val()); 
}).get().join("&") ; 
type: "POST", 
url: "some .php", 
data: str_data, 
success: function(msg){ 
alert( "保存されたデータ: " msg ); 
}); 🎜>
 
わかりました、それは簡単です。該当する場合は、それを使用できます...

ふふ、

ご質問がございましたら、お気軽にお問い合わせください。。

声明：

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

前の記事：JavaScript操作URLの修正版 function_javascriptスキル次の記事：JavaScript操作URLの修正版 function_javascriptスキル

続きを見る

Ajax_jquery を介して Form フォームを送信する Jquery の具体的な実装

関連記事