當下拉列表中包含一個項目時，jQuery更改不會觸發

我試圖在單擊下拉列表中的選項時觸發事件。我找不到解釋如何做到這一點的任何事情。我想要的是引發事件並使用它的價值。當我使用。在而不是。更改我每次點擊選擇時觸發該事件，那不是我想要的，因爲我只想使用所選項目的值。當下拉列表中包含一個項目時，jQuery更改不會觸發

認爲這是動態生成的：

<select id="dropdownOne"> 
<option value="1">NumberOne</option> 
</select>

認爲這是動態生成的：

<select id="dropdownTwo"> 
<option value="1">NumberOne</option> 
<option value="2">NumberTwo</option> 
</select>

JS：

$("select").change("click", function() { 
    //This event is not fired in dropdown one 

    //This event is only fired in dropdown two if I change the option 
    var value = $(this).val(); 

    if(value == 1){ 
     console.log("This logs number 1"); 
    }else{ 
     console.log("This logs number 2"); 
    } 
}

我怎能：

觸發器，只持有一個項目
觸發被點擊的項目的情況下在一個下拉列表中的項目的情況下多次

編輯：所以，我的問題是標記爲重複：

How to call onchange event when dropdown values are same

「複製」有6個答案：

薇琪·庫馬爾：說的是questio的代碼ñ很好，工作。 此答案不對我的問題產生影響

ajpocus：有一個答案，後來被編輯說它不起作用。 不工作

Krupesh科特查：在選擇，相同的行爲。對 使用點擊事件這不是我想要的

Teja公司：解決問題的這個問題但不是我的，還是不會觸發任何事件時，TE選擇只有1個選項，或當您單擊一個選項不止一次 這不是我想要的

charu joshi：用途。在事件有：選項selecter，不能正常工作，因爲：選項selecter是未知的，也可以不是jQuery的API文檔 中找到不工作

DERP：這個答案說明如何刪除重複然後使用更改事件，這可能適用於「重複」的問題，但我從不加載重複的項目在我的選擇，即使如此，它仍然使用更改事件，這不會做我想要的，如我在問題 此答案不對我的問題造成影響

所以上述所有來自「重複」問題的答案不適用於我的問題/問題。也沒有任何答案被標記爲原始海報所接受。

來源

2016-06-21 Niek Jonkman

什麼是'change'事件的關注建議？（$「select」）。on（「change」，function（）{}）。change（）;' – Rayon

'$（「select」）。change（「click」，function（）{'或'$（「select」）。on（「click/change」，function（）{'？ –

在點擊時點擊''和'change'事件是個壞主意，事件之後是一個點擊本身，最好是決定何時附加'click'事件 – Rohit416

試試這個代碼：

var value; 
$('select').focus(function() { 
     value = this.value; 
     if(value == 1){ 
      console.log("This logs number 1"); 
     }else{ 
      console.log("This logs number 2"); 
     } 
    }).change(function() { 
     value = this.value; 
     if(value == 1){ 
     console.log("This logs number 1"); 
     }else{ 
     console.log("This logs number 2"); 
     } 
});

這裏是的jsfiddle鏈接：https://jsfiddle.net/cdantdor/

對於選擇降的一個項目下來，我得到的價值焦點事件和選擇項目後，更新的價值改變事件。希望它會實現你的目的。

來源

2016-06-21 18:37:26

以下代碼可能會滿足您的需求，但它並不完全符合您的要求。當你點擊標有選項的按鈕時，當你點擊關閉菜單時，它會打開一個消失的小菜單。雖然它實際上並不是一個下拉菜單，但它起到一個作用。

問題是您正試圖改變控件的內部，而不是基於控件本身的操作。除非在界面中指定，否則JavaScript對控件內部的控制很少。

看http://www.w3schools.com/howto/howto_js_dropdown.asp

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <script> 
 
     var button; 
 
     var textarea; 
 
     var menu; 
 
     var closer; 
 
     function starter() { 
 
      button = document.getElementById("button"); 
 
      textarea = document.getElementById("textarea"); 
 
      menu = document.getElementById("menu"); 
 
      closer = document.getElementById("close"); 
 
      textarea.value = "Display area for selections\r\n"; 
 
      button.onclick = open; 
 
      closer.onclick = close; 
 
     } 
 
     function close() { 
 
      menu.style.display = "none"; 
 
      menu.style.visibility = "hidden"; 
 
     } 
 
     function open() { 
 
      menu.style.display = "block"; 
 
      menu.style.visibility="visible"; 
 
     } 
 
     function press(char) { 
 
      textarea.value = textarea.value + char + "\r\n"; 
 
     } 
 
     window.onload=starter; 
 
     </script> 
 
     <style> 
 
     #menu { display:none; border: 2px solid black; } 
 
     </style> 
 
    </head> 
 
    <body> 
 
     <p>Click on button marked <i>Options</i> to open menu for selection.</p> 
 
     <form> 
 
     <div id="menu"> 
 
      <p>Clicking on options will cause them to appear in the text box</p> 
 
      <ul> 
 
       <li><input type="button" value="First" onclick="press('First');" /></li> 
 
       <li><input type="button" value="Second" onclick="press('Second');" /></li> 
 
       <li><input type="button" value="Third" onclick="press('Third');"</li> 
 
       <li><input type="button" value="Close menu" id="close" /></li> 
 
      </ul> 
 
      <p>Click on <i>close menu</i> to close this section</p> 
 
     </div> 
 
     <p><input type="button" id="button" value="Options" /> </p> 
 
     <p><textarea cols="20" rows="20" id="textarea"></textarea></p> 
 
     </form> 
 
    </body> 
 
</html>

來源

2016-06-21 18:48:32

根據定義：

當元件的值已經改變發生onChange事件。

當只有一個選項，如：

<select id="dropdownOne"> 
    <option value="1">NumberOne</option> 
</select>

不管你有多少時間來改變/點擊選項，選擇的值將保持不變，。而更改事件將永遠不會執行。

並且根據this answer,onSelect()和onClick()事件不受<option>標記支持。

我建議你預先選擇一個值爲-1或0的附加選項。

<select id="dropdownOne"> 
    <option value="-1">--- Select ---</option> 
    <option value="1">NumberOne</option> 
</select>

或者你可以創建一個自定義選擇控制通過像@Bradley Ross

來源

2016-06-22 06:53:28

當下拉列表中包含一個項目時，jQuery更改不會觸發

回答

相關問題