Question

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

以下是我如何生成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 */ });

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

Answer 2

在调用click处理程序之后可能正在创建元素，因为它不在那里，处理程序没有附加。

尝试在php代码

之后运行该javascript

修改

试

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

Answer 3

在加载页面后使用AJAX加载某些内容时，.click()事件已绑定到现有DOM元素，但不绑定到新元素。
你可以试试这个：

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

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

3 个答案: