ホームページ > 記事 > ウェブフロントエンド > jQueryを使用してセレクトボックスで選択したオプションの値を取得する方法
jQueryを使用してセレクトボックスで選択したオプションの値を取得する方法
- 清浅オリジナル
- 2019-01-16 14:05:472564ブラウズ
jQuery で選択されたセレクターを使用して、選択されたオプション要素を取得できます。また、複数選択ボックスからオプションを選択することもできます。
jQuery の場合: 選択されたセレクター。これは主に、選択された 5a07473c87748fb1bf73f23d45547ab8 要素を選択するために使用されます。jQuery
例:
HTML コードで :selected セレクターを使用して、選択ボックス内の選択されたオプションの値を取得できます。 :
<form>
<label>选择城市：</label>
<select class="country">
<option value="合肥">合肥</option>
<option value="上海">上海</option>
<option value="北京">北京</option>
</select>
</form>jQuery コード:
$(document).ready(function(){
$("select.country").change(function(){
var selectedCountry = $(this).children("option:selected").val();
alert("你选择的城市是： " + selectedCountry);
});
});レンダリングは次のとおりです:
複数選択ボックスからのオプションの選択
複数選択ボックスを使用すると、221f08282418e2996498697df914ce4e に multiple 属性を追加することで、選択ボックスで複数のセクションを有効にすることができます。タグ。
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function(){
var countries = [];
$.each($(".country option:selected"), function(){
countries.push($(this).val());
});
alert("你选择的城市有：" + countries.join(", "));
});
});
</script>
</head>
<body>
<form>
<label>选择城市</label>
<select class="country" multiple="multiple" size="5">
<option>合肥</option>
<option>上海</option>
<option>北京</option>
<option>南京</option>
<option>杭州</option>
</select>
<button type="button">选择</button>
</form>レンダリング:
以上がjQueryを使用してセレクトボックスで選択したオプションの値を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。