ホームページ  >  記事  >  ウェブフロントエンド  >  selectで指定したオプションが選択された場合のトリガーイベントの詳細説明

selectで指定したオプションが選択された場合のトリガーイベントの詳細説明

小云云
小云云オリジナル
2018-03-17 15:17:5411246ブラウズ

ドロップダウン リスト ボックスを使用する場合、選択した 5a07473c87748fb1bf73f23d45547ab8 オプションのイベントをトリガーする必要があります。実際には、5a07473c87748fb1bf73f23d45547ab8 自体には onchange でのみトリガー イベント メソッドがトリガーされます。選択内のメソッド。
オプショントリガーイベントを追加したい場合は、オプションにonclickを追加します。
オプションを選択しない場合は、onclickを再度追加します。
Baidu によると、イベントをトリガーするには、onchange イベントを select に追加する必要があります...
select のダブルクリック イベントをトリガーするときは、ondblclick メソッドを使用します。
select の選択イベントを取得したい場合は、 document.all['name'].value を使用して取得します。name は select の名前です。

select のすべての値を取得したい場合は、for ループを使用してそれを実現できます。コードは次のとおりです:

var vi = document.all['list'].length;
for(var i=0;i<vi;i++){
document.form2.list(i).value; //form2是<form>的名称
}
js方法:
‍‍<select id="pid" onchange="gradeChange()">
    <option grade="1" value="a">选项一</a>
    <option grade="2" value="b">选项二</a>
</select>
<script type="text/JavaScript">
       function gradeChange(){
        var objS = document.getElementById("pid");
        var grade = objS.options[objS.selectedIndex].grade;
        alert(grade);
       }
</script>
jq方法:
<select name="myselect" id="myselect">
    <option value="opt1">选项1</option>
    <option value="opt2">选项2</option>
    <option value="opt3">选项3</option>
</select>
 
$("#myselect").change(function(){
    var opt=$("#myselect").val();
    ...
});

JavaScript は、選択ドロップダウン ボックスの選択された値を取得します
id=test のドロップダウン ボックスがあります。選択された値を取得するにはどうすればよいですか?
ネイティブ JavaScript メソッドと jquery メソッドをそれぞれ使用します

<select id="test"  name="">   
  <option   value="1">text1</option>   
  <option   value="2">text2</option>   
 </select>

1: ネイティブ JavaScript メソッド
1: 選択オブジェクトを取得します: var myselect=document.getElementById("test");
2: 選択されたオブジェクトのインデックスを取得しますitem: varindex=myselect.selectedIndex; // selectedIndex は選択した項目のインデックスを表します
3: 選択した項目の値を取得します options: myselect.options[index].value;
4: 選択した項目のテキストを取得しますoptions: myselect.options[index].text;
2: jquery メソッド (jquery ライブラリがロードされている場合)
1:var options=$("#test option:selected"); //選択された項目を取得します
2:console .log(options.val()); //選択した項目の値を取得します
3:console.log(options.text()) //選択した項目のテキストを取得します

:

select オプションオーバーレイの対処方法

selectコード共有のすべてのオプションを削除するJavaScript

HTMLでSelectオプションのデフォルトの選択を設定する方法

以上がselectで指定したオプションが選択された場合のトリガーイベントの詳細説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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