为什么用PHP动态生成的HTML不响应JavaScript？

Question

身体上的HTML有效,但来自PHP的HTML根本没有响应,为什么？我该如何解决这个问题？

这是我如何生成HTML.

<?php
echo '<div id="TestClick">Click me</div>'
?>

和JavaScript.

$('#TestClick').click(function(e){
    alert ('working')
});

但是作品.

<body>
<div id="TestClick">Click me</div>

</body>

好的,这是我如何使用ajax从PHP获取该HTML.

$.ajax({
    type:"GET",
     url:"../php/feed.php"
    }).done(function(feedback){
$('#feed').html(feedback)
});

Answer 1

如果您的JavaScript位于页面的HEAD中,请确保等待document.ready事件绑定DOM事件.

$(document).ready(function() {
    $('#TestClick').click(function(e){
        alert ('working')
    });
});

这是一般的最佳实践,因为在JavaScript可以与之交互之前需要解析DOM(HTML代码).

请注意,jQuery有一个简写$(document).ready:

$(function() {
    $('#TestClick').click // etc ...
});

如果您通过AJAX加载此元素,则需要在完成AJAX请求并将元素添加到DOM后处理事件.此外,您可以使用事件冒泡来在更高级别的DOM元素上委派事件侦听器(例如document).

$(document).on('click', '#TestClick', function() { /* your stuff */ });

最后但同样重要的是,请确保您ID的DOM中没有重复项.这也可能导致破损.