<div id="main">
<a href="#">aaaaaaaaaaaaaaaaaaaaaa</a><br />
<a href="#">bbbbbbbbbbbbbbbbbbbb</a><br />
<a href="#">ccccccccccccccccccccccccc</a><br />
<a href="#">dddddddddddddddddddd</a><br />
<a href="#">eeeeeeeeeeeeeeeeeeeeee</a><br />
<a href="#">fffffffffffffffffffffffffffffffff</a><br />
<a href="#">gggggggggggggggggggg</a><br />
<a href="#">hhhhhhhhhhhhhhhhhhhh</a>
</div>
<input type="button" value="創建a標簽" id="btnCreate" />

<script src="201102/Scripts/jquery-1.5.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
//后綁定，即動態創建的元素不能擁有綁定的事件！！！
//1.后綁定
// $("#main > a ").click(function () {
// alert($(this).html());
// });

//2.后綁定
// $("#main > a").bind("click", function () {
// alert($(this).text());
// });

//3.后綁定,
// $("#main > a").bind({
// click: function () { alert($(this).text()); },
// mouseover: function () { $(this).css("background-color", "red") },
// mouseout: function () { $(this).css("background-color", "white") }
// });
$("#btnCreate").bind({
click: function () { $("<br /><a href='#'>我是動態創建的</a>").appendTo("#main"); }
});

//4.前綁定，動態創建的元素也擁有了點擊的事件
// $("#main").delegate("a", "click", function () {
// alert($(this).text());
// });

//5.前綁定,live的事件源頭的是documentdelegate的源頭是具體要綁定的元素，所以delegate的效率比live高多了
$("#main a").live("click", function () {
alert($(this).text());
});
});
</script>