Question

我一直试图在用户点击它时切换div的id。首次点击有效，它会更改divs id，但再次按下它时不会再次更改div的id ....

$("#hello").click(function(){
    $(this).attr("id","bye").text("bye");
});

$("#bye").click(function(){
    $(this).attr("id","hello").text("hello");
});

<div id="hello">hello</div>

有关如何使其正常工作的任何想法？

Answer 1

当文档加载时，处理程序被分配给元素，因此没有处理程序分配给bye，因为没有元素。

您可以使用.live()（请注意.delegate()更好，如果有一些祖先可以应用它。）：

示例： http://jsfiddle.net/patrick_dw/Pwa5Q/2/

$("#hello").live('click',function(){
    $(this).attr("id","bye").text("bye");
});

$("#bye").live('click',function(){
    $(this).attr("id","hello").text("hello");
});

或者只是使用hello将处理程序分配给元素，并使用相同的处理程序切换ID。

示例： http://jsfiddle.net/patrick_dw/Pwa5Q/

$("#hello").click(function(){
    var newID = this.id === 'hello' ? 'bye' : 'hello';
    $(this).attr("id",newID).text(newID);
});

Answer 2

它不起作用，因为在div中将div的id设置为'bye'之前绑定了'bye'的click事件处理程序。您可以使用live()解决此问题：

$("#hello").live('click', function(){
    $(this).attr("id","bye").text("bye");
});

$("#bye").live('click', function(){
    $(this).attr("id","hello").text("hello");
});

jQuery：改变div的id两次不工作

2 个答案: