jQuery changeでセレクトボックスが変更された時にvalue値を取得する

2022年10月24日

環境
Google Chrome　106.0.5249.119
Windows 10 Home 64bit
jQuery 3.6.0

構文
$(セレクター名).change(function(){
var 変数名 = $(セレクター名).val();
セレクトボックスを変更した時にchangeメソッドで選択されたvalueの値を取得します。
「$(セレクター名).val()」を使って指定のセレクター名の要素の値を取得します

使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function(){
   $("#city").change(function(){
    var str = $("#city").val();
    alert("value値: "+str);
   });
});
</script>
</head>
<body>
<select id="city">
    <option value="11">tokyo</option>
    <option value="22">oosaka</option>
    <option value="33">fukuoka</option>
</select>

</body>
</html>

実行結果
「oosaka」を選択すると、「value値:22」が表示されます。

jQuery

Posted by arkgame

関連記事: