我有一个执行 mysql 查询并使用
填充表的脚本 $('#results').html(returnData);
mysql 结果包含应该可以点击并重新加载到同一个表中的数据(替换之前的查询)。
对其进行简化和浓缩，以下代码不起作用:
<head>
<script>
$(document).ready(function() {
$('.a').click(function() {
$('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
});
$('.b').click(function() {
$('#results').html('THIS IS VALUE FROM LINK B');
});
});
</script>
</head>
<body>
<div id="results">THIS WILL BE REPLACED WITH VALUE FROM LINK A OR B</div><BR>
<a href="#" class="a">LINK A</a><BR>
<a href="#" class="b">LINK B</a>
如果我单击 LINK A OR B，div id="results" 会正常填充，但是当我将相同的链接放入其中一个 .html 时返回的结果从点击功能链接不起作用，div id“结果”没有重新加载。
所以我的问题是；为什么那行不通？根据您在已从 .html() 传递的表中单击的内容重新加载同一个表的最佳方法是什么？我不想将点击值传递到新页面。
更新: 这将使用 .on()
<script>
$(document).ready(function(){
$('body').on('click', '.a', function() {
$('#results').html('THIS IS VALUE FROM LINK A <a href="#" class="b">B</a>');
});
$('body').on('click', '.b', function() {
$('#results').html('THIS IS VALUE FROM LINK B');
});
});
</script>
</head>
<body>
<div id="results">THIS WILL BE REPLACED WITH VALUE FROM LINK A OR B</div><BR>
<a href="#" class="a">LINK A</a><BR>
<a href="#" class="b">LINK B</a>
最佳答案
详细说明 Abhilash 的评论，您的点击事件未触发的原因是事件监听器仅附加到执行 onReady 时 DOM 中当前存在的元素。
.live() 是在旧版本的 jQuery 中引入的——现在已弃用，取而代之的是 .on()——来解决这个问题。它允许您将事件附加到像主体这样的静态元素，并且当点击事件向上传播到主体时，它会根据您的 .on() 选择器检查触发事件的原始目标元素，如果它们匹配则执行处理程序。
关于jQuery 根据加载表中的数据使用新数据重新加载表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13699416/