2

我有一个 html 表单，它通过 ajax 加载其内容并包含按钮，当单击这些按钮时，应该执行在 html 页面的脚本标记中定义的 JavaScript 函数。SO：按钮是通过 ajax 加载的（有效），但是当单击按钮时，它不会触发所需的操作，也不会触发 Firebug 中的 JavaScript 错误。如何获得通过 ajax 加载的一堆按钮的 onclick 信号以绑定到已经存在的 JavaScript 函数？

编辑：我也应该注意到我没有使用 JQuery。如果这是唯一的方法，我愿意这样做，但除此之外，我宁愿只使用本机 JavaScript。

EDIT2：我的问题涉及更多，但正如所选答案中所述，您应该能够在通过 ajax 发送数据之前在 php 脚本中设置 onclick 事件处理程序。如果您有大量数据响应并希望减少带宽，您可能会考虑在客户端执行所有操作，但我发现在大多数情况下，只需在 php 脚本中设置 onclick 属性会更容易。

4

3 回答 3

2

您的动态生成的按钮可能绑定了一个内联事件。生成按钮时，只需确保它有一个onclick="alreadyExistingFunc();"并且页面会愉快地执行它。

或者，当您的 AJAX 数据完成将自身写入文档时，找到新按钮并将事件绑定到它们：

function ajaxSuccess()
{
    document.getElementById('newButtonIdHere').onClick = function() {
        alreadyExistingFunc();
    }
}

这应该够了吧。另请注意，如果您曾经“需要”一小部分 jQuery 来做某事（例如选择器或事件处理），您几乎总是可以在不加载整个库的情况下完成它。

于 2013-02-16T02:44:34.290 回答
1

将 HTML（检索到的 AJAX 响应）附加/插入到 DOM 并将click事件绑定到它：

function alreadyExistingFunc() { 
    alert('button is clicked!'); 
}

var ajax_data ="<button id='my-button'>My Button</button>";

$('body').append(ajax_data).find('#my-button').on('click', function(e){
    alreadyExistingFunc();
    // some more code...
});

或者：

$('body').append(ajax_data).find('#my-button').on('click', alreadyExistingFunc);
于 2013-02-15T17:09:10.340 回答
0

您还可以使用回调：

function getAjaxContent(callback) {
    $.ajax({url: "url"}).done(function() {
      callback(data);
    });
}

getAjaxContent(function (data) {
    //ajax content has been loaded, add the click event here
}
于 2013-02-15T17:23:42.853 回答