输入列表中选择改变事件(Input List Selection Changed Event)

我有这样的例子：

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Google Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

我需要捕获的事件，当用户选择选项（使用鼠标或键盘）。

我试图做的onchange = “MySuperFunction（）;” 但是，当选择了一个项目，然后在列表聚焦这只适用。

Answer 1:

该input事件应该为你工作所需要的。 据我所知，你不能直接使用一个DataList，但它连接到由输入list属性。 本次活动结合会去上输入：

document.getElementById('browsers-input').addEventListener('input', function () {
   console.log('changed'); 
});

http://jsfiddle.net/vccfv/

Answer 2:

为了让使用JQuery风格的“爆炸丸”的解决方案同样的效果：

$("#browsers-input").on("input", MySuperFunction);

Answer 3:

使用设jQuery你可以使用.change http://jquery.com/

$('datalist#browsers').change(MySuperFunction);

要么

$('datalist#browsers').change(function(){
  // stuff
});

文章来源: Input List Selection Changed Event