ホームページ  >  記事  >  ウェブフロントエンド  >  Jquery 操作の選択の簡単な分析

Jquery 操作の選択の簡単な分析

高洛峰
高洛峰オリジナル
2016-12-28 09:57:02922ブラウズ

特に言うことはありません。コードを見てください:

<select id="Select1">
  <option value="one">一</option>
  <option value="two">二</option>
  <option value="thr">三</option>
  <option value="tho">四</option>
</select>

コメント:

(1) ドロップダウン ボックスに値を割り当てます: $("#Select1").val("二");今回は、値 2 のオプションが選択されています。$("#Select1")[0].selectedIndex または $("#Select1").get(0) を通じて、この時点のインデックスを 1 に取得できます。 selectedIndex、ドロップダウン ボックスのインデックスは 0 から始まります

( 2) 属性 $("#Select1 option[value='two']").attr('selected',true); を設定することで、次のことができます。また、選択範囲も設定します。これは実際には値を割り当てることと同じです

(3) 選択した値に対応するテキストを取得します:

1. 値で取得: $("#Select1 option[value='" + value + " ']").text() または $("#Select1").find("option[value='" + value + "']").text()

2. 選択状態から取得します: $( "#Select1").find("option:selected").text()

(4) ドロップダウン ボックスのレベル 接続:

多くの場合、選択のカスケードが使用されます。 2 番目の選択は、最初の選択で選択された値に応じて変化します。 jQuery ではこれは非常に簡単です。 . Rud: $ (". Selector1").. Change (function () {

// 最初に 2 番目の

(". Selector2") をクリアします。ここでのオプションは通常、ループを使用して生成されます

var option = $("<option>").val(1).text("pxx");
  $(".selector2").append(option);
  });

(5)対応するオプションの値を選択するオプション内のテキストの値

var count = $("#Select1 option").length;
   for (var i = 0; i < count; i++) {
    if ($("#Select1").get(0).options[i].text == $(this).val()) {
     $("#Select1").get(0).options[i].selected = true;
     break;
    }
   }

追伸: jquer で先頭と末尾のスペースを削除する方法: $.trim(value) ;

上記がこの記事の全内容です。この記事の内容が皆さんの勉強や仕事に少しでも役立つことを願っています

Jquery の操作に関するその他の記事については、PHP の中国語 Web サイトにも注目してください。

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