Jqueryナレッジポイント3 jqueryフォームオブジェクトアクション

Jqueryではこの3つの関数にパラメータがあれば付与操作であり、パラメータがなければ取値操作である.val()は重要な方法であり、input系のラベル、select、textareaなど、関連するフォームオブジェクトはサーバ側と対話するためのラベル要素であるため、このval()を明らかにする.
radio、checkbox、selectの値付け操作:

 
  
$("input[name=a]").val(["  1"]); 
  
$("input[type=checkbox]").val(["  ", "  "]); 
  
$("select").val(["  ", "  "]); 
  
 
 

コード解析:
radioに値を割り当て、プロパティセレクタはradioを取得します.
checkboxに値を割り当て、プロパティセレクタはcheckboxを取得し、値は中括弧[]を割り当て、複数の値であれば中間をカンマで区切る.
selectに値を割り当て、ラベルセレクタでselectを取得します.
radio、checkbox、selectの値を取る操作:

 
  
var checkvalue = ""; 
  
var s = $("input[name=a]:checked").val(); 
  
$(":checkbox:checked").each(function() { 
  
checkvalue += $(this).val(); 
  
}); 
  
var selectvalue = ""; 
  
$("select :selected").each(function() { 
  
selectvalue += $(this).val(); 
  
}); 
  
alert("checkvalue:" + checkvalue + "radiovalue:" + s + "selectvalue:" + selectvalue); 
  
 
 

コード分析:sの変数を宣言してname=aのradioの選択された正の値を受信し、var s=$(":radio:checked")と書くこともできる.val()::radioはtype=radioのinput要素と理解でき、属性セレクタの簡略化された書き方である.
checkboxの選択された値を取得します.checkboxは複数選択ボックスであるため、eachで各選択項目を処理するには、プロパティセレクタに基づいて$(「input[type=checkbox]:checked」)と書くこともできます.
selectの場合、属性multiple=「multiple」の場合、複数選択できます.ここではeachで遍歴処理も行います.
まとめ:
Input系のラベル要素については、プロパティセレクタを使用して$("input[type=checkbox])を取得したり、簡潔な方法で$(":checkbox")を取得したりすることができます.
:radio、:submit、:image、:reset、:button、:file、:hidden、:password、:text;
$(":input")すべてのおよび要素を選択radio、checkboxに対して選択する正のアイテムを取得するにはchecked、selectに対してはselected($(「select:selected」)、$(::radio:checked」).val();)



$(function() {

$(":button[value=値を取る]).click(function() {

var checkvalue = "";

//var s = $("input[name=a]:checked").val();

var s = $(":radio:checked").val();

$("input[type=checkbox]:checked").each(function() {

checkvalue += $(this).val();

});

var selectvalue = "";

$("select :selected").each(function() {

selectvalue += $(this).val();

});

alert("checkvalue:"+ checkvalue + "radiovalue:"+ s + "selectvalue:"+ selectvalue);

});

$(":button[value=設定]).click(function() {

$("input[name=a]").val(「娯楽1」);

$("input[type=checkbox]").val(「バスケットボール」「ゲーム」)

$("select").val(「バスケットボール」「ゲーム」)

});

});



サッカー


バスケットボール


読書


ゲーム

---

エンターテインメント1


エンターテインメント2


エンターテインメント3

---

バスケットボールサッカー読书ゲーム