第二个外部 javascript 文件未加载

Question

我的 html head 部分中有这些行当

<script type="text/javascript" src="../behaviour/location.js"></script>
<script type="text/javascript" src="../behaviour/ajax.js"></script>

我单独使用其中任何一个时，外部文件中的代码将按预期执行。

然而，当我同时使用两者时，我发现两者都无法正常工作。我需要做什么来解决这个问题？

location.js

// JavaScript Document

function addLoadEvent (func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function () {
            oldonload();
            func;
        }
    }
}

//county changer
function countyUpdate (message) {

    var name = message.getAttribute("name");
    var check = message.checked;
    var countyId = message.getAttribute("id");
    var countyId = countyId.split("_")[1];
    var innerpost = document.getElementById("innerpost_"+countyId); 
    var checks = innerpost.getElementsByTagName("input");

    for (var i = 0; i< checks.length; i++) {
        if (checks[i].checked == true && check == true) {
        checks[i].checked = false; 
        }
    }

}

//postcode changer
function postcodeUpdate (message) {
    var parent = message.parentNode.parentNode.getAttribute("id").split("_")[1];
    var county = "county_"+parent;
    var checkbox = document.getElementById(county);
    var checked = message.checked;

    if (checked == true) {
        checkbox.checked = false;
    }


}

//get a dynamic list of al postcode checkboxes
function getCounties () {
var county = document.getElementsByTagName("input");


for (var i = 0; i< county.length; i++) {
var check = county[i].getAttribute("type");

if (check == "checkbox") {  
var name = county[i].getAttribute("name");
var parent = county[i].parentNode.parentNode.getAttribute("id");
var parent = parent.split("_")[0];

//action for county
if (parent != "innerpost") {
county[i].onclick = function() { countyUpdate(this); };

    }//if


    //action for postcode
    if (parent == "innerpost") {
    county[i].onclick = function() { postcodeUpdate (this); }; 
    }//if

    }//if
    }//for
    }//function

    addLoadEvent (getCounties);

ajax.js

function loadXMLDoc()
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","cart.php",true);
xmlhttp.send();
}

这是激活第二个文件的内联代码：

<button type="button" onclick="loadXMLDoc()">Change Content</button>

当我尝试一起使用这两个文件时，我似乎无法使用任何函数（甚至不能使用函数中包含的简单警报）。

Answer 1

如果脚本相互冲突就会发生这种情况。

请向我们展示脚本和错误消息。

Answer 2

当我单独使用其中任何一个时，
外部文件中的代码执行为
预计。

但是，当我同时使用两者时，我发现
两者都无法正常工作。我该怎么办
需要做什么来解决这个问题？

听起来这两个文件中的某个地方有冲突。就像一个具有相同名称的函数或一个变量等。

在没有看到这些文件的情况下，您可以：
1. 找出命名冲突（如果确实如此）并进行更改。
2. 将文件中的代码封装在不同的对象中，并通过那里访问方法/属性等。

Answer 3

我敢打赌，您会因为 window.onload= 的杂耍而变得一团糟。我建议您使用标准 window.addEventListener() 接口（如果您想支持 IE，请检查其是否存在并在缺少标准接口时使用 window.attachEvent()也）。这还应该保证 onload 函数按照与设置它们的脚本相同的顺序执行。像这样的东西：

if (window.addEventListener) {
  window.addEventListener('load', somefunc, false);
} else if (window.attachEvent) {
  window.attachEvent('onload', somefunc);
} // else, no way to add multiple onload handlers