是否有与选择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>相关的事件？

回答

相关问题