jQuery单击<ul> <li>元素的函数

Question

我有一个看起来像这样的无序列表:

<ul id="frozen" data-name="nameOfSelect" class="tagit">
   <li class="tagit-choice" tagvalue="2" style="padding-right: 4px;" id="tag-2">
      <div class="tagit-label" data-value="2">káze?</div>
   </li>
   <li class="tagit-choice" tagvalue="1" style="padding-right: 4px;" id="tag-1">
      <div class="tagit-label" data-value="1">žalmxxxx</div>
   </li>
</ul>

我需要将click函数绑定到所有这些函数并获取id="tag-1"要在函数中使用的数据.

我试过这个:

$('#[id|="tag"]').each(function(){
    var tag = this.attr('id'); 
    var tagID = tag.replace('tag-',''); 
    this.click(function (){
       alert('index.php?s=taglist&tag=' + tagID);
       //window.location = string;
    });
});

但是,出于某种原因,似乎这种方法对于<li>元素是错误的,因为我遇到了选择器的问题(似乎).也许我也错过了一些愚蠢的东西......有什么想法吗？

Answer 1

不需要循环,jQuery在内部执行此操作,并且this是本机DOM元素,它具有id属性,但没有attr()方法:

$('[id^="tag-"]').on('click', function() {
    var tag = this.id,
        tagID = tag.replace('tag-', '');

    alert('index.php?s=taglist&tag=' + tagID);
});