是否有與選擇datalist <option>相關的事件？

我有一個選擇（動態）名單在<input>領域：是否有與選擇datalist <option>相關的事件？

<input list="choices"> 
 
<datalist id="choices"> 
 
<option>one</option> 
 
<option>two</option> 
 
</datalist>

是否有事件觸發的<option>的做出選擇之後，對不對？（如果這很重要，我想在Vue.js中捕捉/使用）。鼠標左鍵點擊下面的情況時，這將是：

來源

2017-06-11 WoJ

您可以觸發。每當選項值發生變化時更改jquery – ISHIDA

@ISHIDA：在選擇選項後，您的意思是**，而不是在每次擊鍵後**（因此輸入內容發生變化領域）？那太好了。 – WoJ

是的我在回答中提供了一個示例 – ISHIDA

-1

試試這個。它會檢查該值在輸入框中存在，當你選擇你要求的選項時觸發警報

<input list="choices" id="searchbox"> 
<datalist id="choices"> 
<option id="one">one</option> 
<option>two</option> 
</datalist> 


$("#searchbox").bind('input', function() { 
    if(checkExists($('#searchbox').val()) === true){ 
     alert('item selected') 
    } 
}); 

function checkExists(inputValue) { 
    console.log(inputValue); 

    var x = document.getElementById("choices"); 
    var i; 
    var flag; 
    for (i = 0; i < x.options.length; i++) { 
     if(inputValue == x.options[i].value){ 
      flag = true; 
     } 
    } 
    return flag; 
}

來源

2017-06-11 16:39:56 ISHIDA

這不是我要找的，請參閱https://jsfiddle.net/WoJWoJ/pnfa10gk/ - 每次更改輸入框後都會觸發警報 - 確切的事情是I想要避免 – WoJ

您想在選擇選項時捕獲mousedown事件？ – ISHIDA

這可能是一個選項 - 我希望當選擇了一個選項（點擊）時觸發的事件 - 此時我將清除搜索字段並使用選擇的選項 – WoJ

它看起來像在數據列表選項不跳跳虎任何事件，所以你需要自己的代碼解。

我能夠做類似的火災，在數據列表選項事件東西，在元素使用@input

例如，在你的代碼，你可以嘗試的解決方案開始，這個

<input list="choices" @input="checkInput" > 
<datalist id="choices"> 
<option>one</option> 
<option>two</option> 
</datalist>

在與@input一起使用的方法中，您可以檢查輸入值中的更改。

checkInput(e){ 
    var inputValue = e.target.value; 
    //Your code 
    },

例如，您可以檢查輸入值，請在您的datalyst的一個選項後，是一個有效的選擇，而且條件滿足後，可以啓動任何你想要的另一種方法或。

來源

2018-03-01 10:28:21 Mest

是否有與選擇datalist <option>相關的事件？

回答

相關問題