3

在 HTML 中，ID="project_pick" 的下拉菜单将触发更改事件，将选定的值发送到 getallreports.php 文件。这行得通。PHP 文件执行 MySQL 查找并在一些 HTML 中返回值。这也有效，并且在页面上看起来很棒。下面是将所选项目发送到 PHP 文件的 jQuery/ajax 代码：

$('#project_pick').change(function(e) {
    $.ajax({
        type: "POST",
        url: "getallreports.php",
        data: "project_id=" + $(this).val(),
        success:function(data){
            $('#reportstable').html(data);
        }
    });
});

返回的数据出现在指定的 div 内，并包含具有特定 ID 的锚标记，这些 ID 应该允许其他 JQuery 事件发生。返回的 HTML 的片段：

<table><tr>
    <td>Report 1</td><td><a href="#" id="change_1">click to change</a></td>
    <td>Report 2</td><td><a href="#" id="change_2">click to change</a></td>
</tr></table>

在上述点击事件上触发的 jQuery 代码是：

$('#change_1').click(function() {
    alert('Change Report One was clicked');
});

但是，单击上面的锚标记什么也不做。此外，返回的 HTML 甚至不会出现在源代码中——尽管它显示在屏幕和 firebug 中。

我错过了什么？如何让该点击事件触发？

编辑：

我被提醒了 .on('click', etc) 事件（感谢 Michael 和 Zirkms），但是当我尝试将其添加到我的代码中时，下拉列表的 .change 事件停止触发。也许下面的代码需要改头换面？

$('#project_pick').on(change(function(e) {
    $.ajax({
        type: "POST",
        url: "getallreports.php",
        data: "project_id=" + $(this).val(),
        success:function(data){
            $('#reportstable').html(data);
        }
    });
});
4

1 回答 1

4

在$('#test').click()代码执行的那一刻， #testDOM 中不存在，所以你没有将该处理程序绑定到某个地方。

利用

$(document).on('click', '#test', function() { ... });

反而

或者（更好）如果您有一个插入检索到的 html 的特定节点 - 使用一些特定的选择器而不是$(document)喜欢

$('#reportstable').on(...)

甚至没有出现在源代码中

在“查看源代码”中，浏览器通常会根据请求显示来自服务器的响应，而不反映 JS DOM 修改。

于 2012-09-10T00:03:00.743 回答