Question

请注意混淆，请参阅下面的简化示例。我知道如何使用JQuery的动态结构来实现这一点：

插入为.innerHTML

后可以正常工作

<button class='ctrl_row'>Click Me</button>

$(document).on("click", ".ctrl_row", function(){
    //do something
});

插入.innerHTML后，这不起作用：

<button onclick='preview()'>Click Me</button>

function preview() {
    //do something
}

我有一个相当数量的纯JavaScript（不是JQuery）写在一个PHP循环（很多getElementById的），它工作，所以我不想转换它，所以我如何得到纯javascript 在被AJAX加载后工作？

Answer 1

您可以尝试在成功回调中使用此功能。首先使用 .innerHTML 插入按钮，如：

<button id="buttonId">Click Me</button>

然后，您可以使用以下事件处理程序在纯JavaScript中绑定事件：

var button = document.getElementById("buttonId");

if (button.addEventListener)
    button.addEventListener("click", yourhandlerfunction, false);
else if (button.attachEvent)
    button.attachEvent ("onclick", yourhandlerfunction);

您可以阅读更多相关信息HERE。希望这会帮助你！

Answer 2

这里已经回答了对框架的任何依赖......

Does this Ajax method work in many browsers and operating systems?

Answer 3

尝试使用jQuery的append('yourhtmlajaxresponse')函数代替.innerHTML，以使事件正常工作。

Answer 4

这是纯js中的示例代码：

var req;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    req=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    req=new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("POST", "url to the reqst page", true);
    req.send();
    req.onreadystatechange=function(){
        if(req.readyState==4&&req.status==200){

                //here you will get the result from the reqst page after execution
        }
}

将此代码放在函数中，并在需要时调用。

在AJAX调用之后调用JavaScript函数

4 个答案: