jquery - jquery中的选择器-获取rel属性

Question

我有这样的html代码：

<li id="vol" rel="1">
    // something here
</li>
<li id="vol" rel="2">
    // something here
</li>
<li id="vol" rel="3">
    // something here
</li>

我正在尝试通过此代码获取 rel 属性：

$('#vol').click(function(){
  var rel = $(this).attr('rel');
});

但它不起作用。我也改成this，#vol但没有用。我该怎么办？

Answer 1

通过不工作，我假设li您单击的任何内容都会返回1，这是由于页面中有多个 ID 造成的。ID 应该是唯一的，请改用 class。

尝试

<li class="vol" rel="1">
    // something here
</li>
<li class="vol" rel="2">
    // something here
</li>
<li class="vol" rel="3">
    // something here
</li>

JS:

$('.vol').click(function(){
  var rel = $(this).prop('rel');
});

Answer 2

你们都是id一样的，所以让他们与众不同。假设你li在ul哪个班级里面clsTest

$('.clsTest li').click(function(){
  var rel = $(this).attr('rel');
  alert(rel);
});

Answer 3

Selector by "id" (#id) 只选择一个元素，使用 "class" (.class) 代替

Answer 4

将您的代码更改为

<li class="vol" rel="1">
    // something here
</li>
<li class="vol" rel="2">
    // something here
</li>
<li class="vol" rel="3">
    // something here
</li>

<script>
$('body').delegate('li.vol','click',function(){
  var rel = $(this).attr('rel');
});
</script>

Answer 5

$('.li').on('click', function(){
  var target = $(this).attr('rel');
});

我认为如果您使用 li，我们会直接尝试使用 element