如何让javascript与使用ajax加载的htm一起工作

时间:2015-10-06 11:10:00

标签: javascript php html ajax

这应该是非常直接的,但我不能绕过它,我会感激任何帮助。

我的php主页底部有一些JavaScript。所有这个脚本都是在窗口加载时调用一个函数,并回显导航,这非常有效。

问题是当导航时。填充,我的主页上的JavaScript无法与它交互。

<RenderPattern Name="DisplayPattern">
  <Column UseRelatedField="TRUE" HTMLEncode="FALSE" />
</RenderPattern>

};

navigation.php只包含一些要回显的html,这也很有效。

//Ajax that loads the nav
window.onload = function(){
 function loadContent(where,what) {

if (window.XMLHttpRequest){
  var xmlhttp = new XMLHttpRequest();
} else { 
  var xmlhttp = new ActiveXObject('Microsoft.XMLHTTP'); 
}

xmlhttp.onreadystatechange = function(){
  if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
    document.getElementById(where).innerHTML = xmlhttp.responseText;
  }
}

    xmlhttp.open('GET', what,true);
    xmlhttp.send();
};

//the nav function is called directly under it

loadContent('navigator','include/navigation.php');

//after the above is loaded, any javascript written to call an element from the loaded html does not work.

&#39;

现在我的困境是上面已经加载了。我在window.onload函数中编写的任何JavaScript都不能与上面的任何元素一起使用。我应该给予任何帮助。使用vanilla js请不要使用jquery。谢谢

2 个答案:

答案 0 :(得分:1)

我可以看到许多帖子推荐xmlhttp.readyState == 4 && xmlhttp.status == 200。但经过大量试验后,它无法可靠地加载内容。然后使用firebug我发现在显示内容时总会出现OK标志,所以我尝试了xhr.statusText === "OK"并且每次都可靠地工作。然后到w3网站,我发现只有在加载内容后才会给出OK标志,就像xmlhttp.readyState == 4 && xmlhttp.status == 200一样。在MSDN论坛上,我检查了他们的方法,他们也使用了xhr.statusText === "OK"。我不知道为什么,但这对我来说最有效。这是一些代码:

&#13;
&#13;
var d=document.getElementById("clicks");
 
var ajaxCall = function() {
    var d=document.getElementById("clicks");
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "http://localhost/JSON/text.txt", true);
    xhr.send();
    xhr.onreadystatechange = function () {
        if(xhr.statusText === "OK") {
        d.innerHTML = xhr.response;
        } else {
        d.innerHTML = "No";
        }
    }


    };

   d.addEventListener("click",ajaxCall,false);
&#13;
&#13;
&#13;

答案 1 :(得分:0)

$.ajax({
    method: "POST", //GET/POST
    url: "handler.php" //URL where you will check everything or give your response
    data: {varName: $variable }
}).done(function(data){
    $("div").append(data); //Puts data in div
});

这就是AJAX请求的工作原理!!!