Question

我在<option>中有很多<select>个名为zip的额外属性

<SELECT id="city">
  <OPTION zip="AUC 1291 100005" value="1">City 1</OPTION>
  <OPTION zip=" 1295 100006" value="2">City 2</OPTION>
  <OPTION zip=" 1299 100008" value="3">City 3</OPTION>
</SELECT>

现在我想选择Text或ZIP包含字符串值的选项，但以下代码不起作用。

var val = '1291'; //Zip code
var x = $('#city option:contains('+val+'), #city zip:contains('+val+')').val();

为什么？

Answer 1

如果要选择具有属性的元素，taht值包含请求的字符串，则必须使用：

  var val = '1291'; //Zip code
  var x = $('#city option[zip*="' + val + '"]').val();

如上所述：http://api.jquery.com/attribute-contains-selector/

但正如大家所说，更好的方法是使用HTML5 data-zip属性而不是zip

（只是前缀data-）。

在这种情况下，您的选择器将是：

  var x = $('#city option[data-zip*="' + val + '"]').val();

希望它有所帮助。

Answer 2

contains检查内部元素而不是属性，你应该使用类似的东西：

$('#city option').filter(function(){
    return this.innerHTML.indexOf(val) > -1 || 
           $(this).attr('zip').indexOf(val) > -1;
});

请注意zip不是有效的HTML属性，而是使用data-zip代替。

$('#city option').filter(function(){
    return this.innerHTML.indexOf(val) > -1 || 
           $(this).data('zip').indexOf(val) > -1;
});

Answer 3

这是我的问题的答案。经过测试和工作：）

var x = $('#city option:contains('+val+'), #city [data-zip*='+val+']').val();

带有contains（）的jquery多选择器

3 个答案: