Question

我从一本用来学习jquery的书中得到了这个html代码我修改了一下

<body>
<h4><i>More</i> Mitch Hedberg Quotes</h4>
<div>
  <input type='submit' id='tmpQuote1' value='View Quote' />
</div>
<div>
  <input type='submit' id='tmpQuote2' value='View Quote' />
</div>
<div>
<p id="paragraph"> some text that will disappear</p>
</div>

$(document).ready(
function() {
$('p').mouseover(
function(){
$(this).replaceWith("<p> the text changed to this text </p>");
}
);

$('input#tmpQuote1').click(
  function($e) {
    $e.preventDefault();

    $(this).replaceWith(
      "<p>\n" +
      "  I would imagine that if you could understand \n" + 
      "  Morse code, a tap dancer would drive you crazy.\n" +
      "</p>\n"
    );
  }
);

$('input#tmpQuote2').click(
  function($e) {
    $e.preventDefault();

    $(this).replaceWith(
      "<p>\n" +
      "  I'd like to get four people who do cart wheels \n" +
      "  very good, and make a cart.\n" +
      "</p>\n"
    );
  }
);

基本上当我将鼠标悬停在最后一段时，它会更改文字。当我点击这两个按钮时，它们会改为段落+文本。到现在为止还挺好。但我遇到的问题是理解为什么当我将鼠标悬停在第一个＆amp;第二个（新生成的）段落，鼠标悬停不起作用。 Jquery解析器有延迟吗？或者也许我不确切知道这是多么有效。

感谢

Answer 1

您创建的功能仅适用于创建文档时创建的所有对象。稍后创建的任何内容，即动态添加，都不会获得这些事件处理程序。

另请参阅此问题：click() jquery function not available on new divs

基本上，要解决此问题，您需要使用jquery delegate函数来解决问题。

（有关deligate()而非live()）

的原因，请参阅此处

Answer 2

这是因为事件处理程序未订阅新<p>的点击事件。您应该在将事件处理程序添加到文档后手动设置它，或者使用.live('click', function...)或更好的jQuery.livequery插件。

Answer 3

将.click更改为.live('click',function(){...});，您就会很好。原因如上所述：事件处理程序仅添加到已存在的内容中。如果要将其添加到动态添加的每个内容中，则必须使用.live。

jquery $这会丢失当前标签的踪迹？

3 个答案: