ユーザがドロップダウンメニュー内で特定の<option>
をクリックしたときにjavascript機能を実行する方法はありますか?JavaScript実行機能<option>をクリック
答えて
<select>
要素は、onchange
イベントをサポートします。
あなたは、ユーザーがクリックしたオプションをチェックして、ご希望のコードを実行するchange
イベントを使用することができます。 jQueryので
:あなたは<select>
要素のonchange
イベントをフックし、値をチェックする必要が
$('#yourSelect').change(function(){
var item = $(this).val();
if (item === "Specified Choice")
{
//do your stuff here
}
});
。あなたはそれを試しましたか?
<option>
の中では、onclick
イベントを使用して、実行するjavascript関数を指定することができます。
など。
<option onclick="yourFunction()">
あなたのHTMLは次のようになります。
<select onchange="functionName(this.value)">
<option value="1"> 1 </option>
<option value="2"> 2 </option>
<option value="3"> 3 </option>
</select>
をあなたのJavaScriptでは、あなたは(例:functionName()
)機能だろう を、あなたはそれぞれのケースをテストするために、その関数を使用します。
プロジェクトで使用jqueryの..
HTMLコード:
<select id="myselect">
<option value="">Select</option>
<option value="1">StactOverFlow</option>
<option value="2">SuperUser</option>
<option value="3">Another 1</option>
<option value="4">Another 2</option>
<option value="5">Another 3</option>
</select>
のjQueryコード:
$("#myselect").bind('change', function(){
switch($(this).val()){
case "1":
click_action_1();
break;
case "2":
click_action_2();
break;
case "3":
click_action_3();
break;
}
});
function click_action_1(){
alert('Hi 1');
}
function click_action_2(){
alert('Hi 2');
}
function click_action_3(){
alert('Hi 3');
}
あなたもアクションで<option>
ウォッチで新しいJavaScript関数を実行することができます:http://jsfiddle.net/extremerose71/PnfCk/8/
お楽しみください...ここで
:!elem
あなたのSELECT要素をある
elem.onclick = function (e) {
if (e.target.tagName.toLowerCase() === 'option') {
// an <option> element was clicked
// do your thing
}
};
。
はChrome( 'v42')では動作しません。 – Dwelle
@Dwellee Chromeのバグのようです。私はそれを報告します。 –
- 1. infoBoxをクリックすると、「クリック」機能にマップされたjavascriptが実行されない
- 2. 'li'をクリックしないで実行する機能
- 3. が実行機能
- 4. iOSはクリックするとjavascript機能をバインドします<html>
- 5. Chrome拡張機能でウェブページでJavascriptを実行できない
- 6. QWebKit - ページのjavascript機能を実行しますか?
- 7. 外部ウェブサイトのページロードにjavascript機能を自動的に実行
- 8. クリックイベントでjavascript/jqueryで実行中の機能を停止する
- 9. Railsモバイルサイトでjavascript機能を実行できません
- 10. は、私はこの機能を実行するとJavaScriptで
- 11. 実行jQueryの機能
- 12. 自己実行機能
- 13. 実行jsの機能
- 14. 機能の実行者
- 15. 実行JS機能条件
- 16. 更新ボタンでカスタムのJavaScript機能を実行する剣道のアップロードコントロールをクリックする
- 17. URLでJavaScript機能を実行していますか? google.com?javascript:(func())
- 18. 自己実行機能はDOMで実行可能ですか?
- 19. 本文をクリックして機能を実行してください:指示文
- 20. PhantomJsリンクをクリックするか、ページ上の機能を実行しています
- 21. フォームのクリック機能
- 22. クリック機能のJquery
- 23. jbutton.doClick()はボタンをクリックしますが、機能は実行しません
- 24. ボタンを2回クリックして実行する機能があります
- 25. クリック可能なJavaScript
- 26. JavaのJavaScript機能のクリックをシミュレートします
- 27. "examplelink.php#anchor"をクリックしたときにjavascriptが機能しない
- 28. JavaScriptのクリック機能をonLoadに変換するヘルプ
- 29. ボタンをクリックしたときのjavascriptコール機能
- 30. jQuery UIダイアログを開く実行機能
誰かが、具体的には、一般的なJavaScriptで答えるために親切であることはJQueryの答えを聞いていないときのように思えます。コース私はあなたがjqueryの男の男と呼ぶものではないからだと言うだけです。 – Claude
私はそのことを認識していましたが、以前はJquery以外の人でもありました。しかし、私はJqueryを使っていたのでしばらくしていましたが、正直言ってバニラのJSでこれをやる方法はもう分かりません。 – xbonez