jquery - 处理在运行时定义 id 的元素上的事件

Question

我想通过它处理元素事件，因为 id 是在运行时定义的。

   <input type='submit' name='status' value='like' id='like'/>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

  $('#like').live('click',function(){
     alert('like');
      $(this).attr({'id':'unlick','value':'unlike'});
  })​​​​​​​​​​;

   $('input').delegate('#unlike','click',function(){
      alert('unlike');
      $(this).attr({'id':'lick','value':'like'});
  });

下面是问题的demo ​</p>

Answer 1

一些错别字，您可以.on用于喜欢和不喜欢。

这是一个工作示例：

http://jsfiddle.net/CgKwt/2/

Answer 2

Typo船长再次出击。也替换unlick为unlike并使用live()第二个处理程序：

$('#like').live('click',function(){
    alert('like');
    $(this).prop('id', 'unlike').val('unlike');
});

$('#unlike').live('click',function(){
    alert('unlike');
    $(this).prop('id', 'like').val('like');
});

您还应该使用.prop()设置 id 和.val()设置值。

哦，考虑不更改 ID，而是将标志（like/unlike）存储在数据属性中，并在事件处理程序中检查它。然后，您不需要实时事件或委托，而可以简单地绑定常规事件。

Answer 3

我会做类似下面的事情，而不是编写 2 个处理程序，

标记：

<input type='submit' name='status' class="like_status" value='like' id='like'/>

JS

$('.like_status').on('click',function(){
    alert(this.id);

    if (this.id == 'like') {      
       $(this).attr({'id':'unlike','value':'unlike'});
    } else {      
       $(this).attr({'id':'like','value':'like'});
    }
});

或者您可以简单地使用this.idandthis.value来代替 jQuery 函数。

$('.like_status').on('click',function(){
    var btnTxt = (this.id == 'like')?'unlike': 'like';
    this.id = btnTxt;
    this.value = btnTxt;  //Or some other text.
});

演示