我有网页布局，上面可以包含多个链接。这些链接是使用 AJAX 函数动态创建的。它工作正常。
但是，我不知道如何使用这些“动态创建的链接”（即，如果我单击它们，如何调用一些 JS 或 jQuery 函数）。我猜浏览器无法识别它们，因为它们是在页面加载后创建的。
是否有一些功能可以“重新渲染”我的页面和上面的元素？
Tnx in adv 为您提供帮助！
【问题讨论】：
标签： javascript jquery dynamic-data
您可以使用 jQuery 提供的以下两种方法：
第一个是.live()方法，另一个是.delegate()方法。
第一个的用法很简单：
$(document).ready(function() {
$("#dynamicElement").live("click", function() {
//do something
});
}
如您所见，第一个参数是您要绑定的事件，第二个参数是处理该事件的函数。它的工作方式并不完全像“重新渲染”。执行此操作的常用方法（$("#dynamicElement").click(...) 或 $("#dynamicElement").bind("click", ...)）通过在 DOM 正确加载（$(document).ready(...)）时将确定事件的事件处理程序附加到 DOM 元素来工作。现在，很明显，这不适用于动态生成的元素，因为它们在 DOM 首次加载时并不存在。
.live() 的工作方式是，它不是将通风处理程序附加到 DOM 元素本身，而是将其附加到 document 元素，利用 JS 和 DOM 的冒泡属性（当您单击动态生成的元素并且没有附加事件处理程序，它一直在寻找顶部直到找到一个）。
听起来很整洁，对吧？但是这个方法有一点技术问题，正如我所说，它将事件处理程序附加到 DOM 的顶部，所以当你点击元素时，你的浏览器必须遍历整个 DOM 树，直到找到合适的事件处理程序。顺便说一句，这个过程非常低效。这就是 .delegate() 方法出现的地方。
让我们假设以下 HTML 结构：
<html>
<head>
...
</head>
<body>
<div id="links-container">
<!-- Here's where the dynamically generated content will be -->
</div>
</body>
</html>
因此，使用 .delegate() 方法，您可以将其附加到父 DOM 元素，而不是将事件处理程序绑定到 DOM 的顶部。一个 DOM 元素，您确定它将位于 DOM 树中动态生成的内容的某个位置。离他们越近，效果就越好。所以，这应该会变魔术：
$(document).ready(function() {
$("#links-container").delegate("#dynamicElement", "click", function() {
//do something
});
}
这是一个很长的答案，但我喜欢解释它背后的理论哈哈。
编辑：您应该更正您的标记，它是无效的，因为：1）锚点不允许使用值属性，以及 2）您不能有 2 个或更多标签同一个身份证。试试这个：
<a class="removeLineItem" id="delete-1">Delete</a>
<a class="removeLineItem" id="delete-2">Delete</a>
<a class="removeLineItem" id="delete-3">Delete</a>
并确定点击了哪个锚点
$(document).ready(function() {
$("#links-container").delegate(".removeLineItem", "click", function() {
var anchorClicked = $(this).attr("id"),
valueClicked = anchorClicked.split("-")[1];
});
}
使用该代码，您将在 anchorClicked 变量中存储单击的链接的 id，并在 valueClicked 中存储与锚点关联的数字。
在您的页面初始化代码中，您可以像这样设置处理程序：
$(function() {
$('#myForm input.needsHandler').live('click', function(ev) {
// .. handle the click event
});
});
您只需要能够按类或其他方式识别输入元素。
【讨论】：
delegate？ $('#myForm').delegate(...
这些链接是如何动态创建的？您可以使用正确的selector，前提是它们使用相同的类名或位于相同的标签中，等等。
【讨论】：
考虑 html 表单
<form>
<input type="text" id="id" name="id"/>
<input type="button" id="check" name="check value="check"/>
</form>
jquery 脚本
$('#check).click(function() {
if($('#id).val() == '') {
alert('load the data!!!!);
}
});
在此处单击按钮时，脚本会检查文本框 id 的值是否为空。如果它为空，它将返回一条警报消息.... 我认为这是您正在寻找的解决方案.....
祝你有美好的一天..
【讨论】：
通常，浏览器处理响应HTML并将其添加到DOM树中，但有时，当前定义的事件不起作用，只需在您调用ajax请求时重新初始化事件..
【讨论】：
使用动态创建的元素所需要做的就是创建可以用来定位它们的标识符。在 Firebug 的控制台或 Chrome 或 IE 的开发者工具中尝试以下代码。
$(".everyonelovesstackoverflow").html('<a id="l1" href="http://www.google.com">google</a> <a id="l2" href="http://www.yahoo.com">yahoo</a>');
$("#l1").click(function(){alert("google");});
$("#l2").click(function(){alert("yahoo");});
您现在应该有两个链接，通常是动态创建的广告，然后添加了一个 onclick 处理程序以显示警报（我没有阻止默认行为，所以它会导致您离开页面。 )
jQuery 的 .live 将允许您自动将处理程序添加到新创建的元素。
【讨论】：
如果您的链接是通过 AJAX 进入的，您可以在服务器上设置 onclick 属性。只需像这样将链接输出到 AJAX 中：
<a href="#" onclick="callYourFunctionHere();return false;">Holy crap I'm a link</a>
return false 确保链接不会重新加载页面。
希望这会有所帮助！
【讨论】：