在HTML中的Datalist中查找所选项目

我有一个像这样的数据主义者

我正在使用jquery向datalist添加“option”。 现在的问题是我如何找到用户在datalist中选择/点击的选项。 我想在用户选择/点击选项后立即获取选项的ID？

Answer 1

您可以在输入字段中添加ID – 并侦听输入事件。 然后，您必须获取要在选择器中使用的输入值以获取所选选项

 $(function() { $('#browserinput').on('input',function() { var opt = $('option[value="'+$(this).val()+'"]'); alert(opt.length ? opt.attr('id') : 'NO OPTION'); }); }); 

Answer 2

您可以使用is（’：selected’）检查

 $('#browsers option').each(function() { if($(this).is(':selected')){ // Your code here with the selected value } }); 

或者获取所选的选项值

  $('#browsers').val(); 

Answer 3

试试这种方式

   $(function(){ $('#input').change(function(){ console.log($("#browsers option[value='" + $('#input').val() + "']").attr('id')); }); }); 

http://jsfiddle.net/smap06ro/45/

Answer 4

试试这个，我得到了’data-id’值。

    //if you click/choose 'Firefox' then 'op2' will show