Javascript jQuery找不到更改的ID_Javascript_Jquery_Css

Javascript jQuery找不到更改的ID

javascript jquery css

Javascript jQuery找不到更改的ID,javascript,jquery,css,Javascript,Jquery,Css,很难想出这个问题的标题更多的概念证明，我想知道为什么这不起作用。我试图做的是使用jquery事件来更改ID属性，然后使用另一个绑定到此新更改的ID的jquery事件例如： <?php echo <<<END <html> <head> <style> #before { color:maroon; } #after { color:blue; } </style> <script type="t

很难想出这个问题的标题

更多的概念证明，我想知道为什么这不起作用。我试图做的是使用jquery事件来更改ID属性，然后使用另一个绑定到此新更改的ID的jquery事件

例如：

<?php 
echo <<<END
<html>
<head>
<style>
#before {
    color:maroon;
}
#after {
    color:blue;
}
</style>

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<title>Test</title>

<script type="text/javascript">
$(document).ready(function(){
    $("#before").hover(function() {
        $(this).attr("id","after");
    }); 

    $( "#after" ).click(function() {
        alert( "Handler for .click() called." );
    });
});
</script>
</head>
<body>
<p id="before">TEST TEXT</p>
</body>
</html>
END;
?>

将鼠标悬停在我的测试文本上，颜色会从栗色变为蓝色，正如预期的那样。据我所知，文本现在的ID为“after”，单击时将应用click事件处理程序函数。但是，快速事件处理程序及其相关警报似乎不会触发这种情况

我不熟悉jquery，是否有我忽略的更新处理函数？

它的工作原理与jquery相同

将事件处理程序添加到使用选择器找到元素的元素时，在将处理程序添加到元素之后执行代码时，选择器仅执行一次。一旦发生，如果更改与元素关联的选择器值，它将不会反映在附加的处理程序中

例如，在您的例子中，您正在将a处理程序添加到dom ready handler中id为

before

的元素中，因此一旦触发dom ready事件，将对选择器进行求值，并返回要向其添加处理程序的单个元素。在同一个dom就绪处理程序中，您正试图将单击处理程序添加到id为

的元素中，但在dom就绪时，没有具有该id的元素，因此处理程序不会附加到任何元素
现在，稍后您将更改elemnet的id，但这不会影响已连接的处理程序，也不会添加新的处理程序
这里的解决方案是使用一种称为的机制

演示：

$（文档）.ready（函数（）{
//当鼠标进入元素时，不需要使用hover，因为您希望添加类，并且不想在mouseleave中执行任何操作
$（“#mytarget”）.mouseenter（函数（）{
$（this.addClass（“after”）.removeClass（“before”）；
});
//看看事件委托的用法
$（文档）.on（'click'，'after'，function（）{
警报（“调用了.click（）的处理程序”）；
})
});
。之前{
颜色：栗色；
}
.之后{
颜色：蓝色；
}

测试文本
您可以在悬停事件之后触发click事件
$(document).ready(function(){
$("#before").hover(function() {
    $(this).attr("id","after");
    $( "#after" ).click(function() {
    alert( "Handler for .click() called." );
});
    return false;
}); 
});

您不能这样做，因为在您的案例中，选择器仅在dom就绪时计算。。。您需要使用事件委派。。。另外，我建议更改类属性，而不是更改ID。您是否认为这在文档之外有效。准备好了吗？或者，您实际上是在说，在元素的ID发生更改后与元素进行交互是不可能的？有没有办法强制更新DOM？将其标记为重复，因为同样的概念在这里也适用。。。由于选择器在运行时会发生更改，因此这似乎是合理的。很好的发现-我搜索了一下，没有找到任何确定的东西。如果这个“重复”的问题没有证明像我需要的那样有用，它至少会帮助我制定一个新的问题。谢谢你的帮助。您的JSFIDLE链接准确地显示了我想要的实现方法，如果这是一个答案，我会给出答案。谢谢，againI还想指出，似乎有更适合运行时的方法来更改类。例如