选择器不能完全工作

Question

单击链接后，我使用html()函数填充<div>。基本上，我不希望页面刷新，但把内容放在<div>内。

这工作正常。但是，我将链接传递到<div>，并试图选择它！正如我预料的那样，它实际上把我带到了不同的页面，而不是填充下一个<div>。

<script type="text/javascript"> 
$(document).ready(function() { 

    $(".link1").click(function(){ $("#div1").html("<a href='#' class='link2'>click here</a>"); return false; }); 
    $(".link2").click(function(){ $("#div2").html("Just Text"); return false; }); 

}); 
</script> 

<div id="div1"></div> 
<div id="div2"></div> 

Answer 1

你可能想使用live()：

$(function() { 
    $("a.ink1").live("click", function() { 
    $("#div1").html("<a href='#' class='link2'>Click here</a>'); 
    return false; 
    }); 
    $("a.link2").live("click", function() { 
    $("#div2").html("Just text"); 
    return false; 
    }); 
}); 

的原因是，当你绑定与点击（事件），它这样做的元素当时存在不是元素创建后来。这就是live()的用途。

Answer 2

如何：

<script type="text/javascript"> 
$(document).ready(function() { 

    $(".link1").click(function(){ $("#div1").html("<a href='#' class='link2'>click here</a>"); renderlink2(); return false; }); 
    renderlink2(); 

}); 

function renderlink2(){ 
    $(".link2").click(function(){ $("#div2").html("Just Text"); return false; }); 
} 
</script> 

<div id="div1"></div> 
<div id="div2"></div>