jquery操作selectよくある方法大全【7つの状況】


本論文の例は、jquery操作selectの一般的な方法を説明する。皆さんに参考にしてあげます。具体的には以下の通りです。
前のHTMLページのデザインでフレームをオフしたり、multiple=「multiiple」の時にリストとして表現します。よくページで操作しますが、これらの操作は以下の通りです。
1.選択したselectのoptionの値またはtextを取得します。
2.選択したselectのoptionを削除します。
3.selectに新しいoptionを追加します。
4.select optionの長さ、つまり個数sizeを得る
5.クリアセレクト.
6.2つのselectボックスの間にお互いに追加して削除し、左から右にかけて、右から左にかけての操作は、通常は複数の場合があります。
7.セレクトボックスにある値のオプションがあるかどうかを判断する
第一の状況に対しては、次のような方法を用いる。

$("#select_id").change(function(){//code...});  // Select    ,          
var checkText=$("#select_id").find("option:selected").text();  //  Select   Text
var checkValue=$("#select_id").val();  //  Select   Value
var checkIndex=$("#select_id ").get(0).selectedIndex;  //  Select      
var maxIndex=$("#select_id option:last").attr("index");  //  Select       jQuery  Select   Text Value:


$("#select_id ").get(0).selectedIndex=1;  //  Select    1    
$("#select_id ").val(4);  //  Select Value  4    
$("#select_id option[text='jQuery']").attr("selected", true);  //  Select Text  jQuery    

第二の場合、削除の処理:

$("#select_id option:last").remove();  //  Select      Option(    )
$("#select_id option[index='0']").remove();  //  Select     0 Option(   )
$("#select_id option[value='3']").remove();  //  Select Value='3' Option
$("#select_id option[text='4']").remove();  //  Select Text='4' Option

選択したオプトモーションを削除するには、まず選択したオプトの番号を取得します。
第三の場合、optionの処理を追加します。

$("#select_id").append("<option value='Value'>Text</option>");  // Select    Option(   )
$("#select_id").prepend("<option value='0'>   </option>");  // Select    Option(     )

第四の状況に対して、selectの長さを得る。

var totalcount=$("#single_user_choice").get(0).options.length;

第5の場合,暇を見つけてselectを作る。

$("#single_user_choice").get(0).options.length=0;

第六の場合。2つのselectフレームの間に、互いに追加して削除し、左から右へ、右から左への操作は、通常は複数の場合、multiple=「multiple」が設置されています。

var $options = $('#select1 option:selected');//        
var $remove = $options.remove();//           
$remove.appendTo('#select2');//     

第七の場合、selectにあるvalueが存在するかどうかを判断する。  のoption

function is_Exists(selectid,value){
  var theid='#'+selectid;
  var count=$(theid).get(0).options.length;
  var isExist = false;
  for(var i=0;i<count;i++){
    if ($(theid).get(0).options[i].value == value){
      isExist=true;
      break;
    }
  }
  return isExist;
}

jQuery関連の内容について興味がある読者は、当駅のテーマを調べてもいいです。「jQueryよくある事件の使い方とテクニックをまとめました。」、「jQuery常用プラグインと使い方のまとめ」、「jQuery操作jsonデータ技術まとめ」、「jQuery拡張テクニックのまとめ」、「jQueryよくある経典効果のまとめ」および「jqueryセレクタの使い方のまとめ
ここで述べたように、皆さんのjQueryプログラムの設計に役に立ちます。