Question

我已经搜索过这个答案并实现了我在SO和其他地方找到的一些东西无济于事。我有几个javascript函数完美地工作，直到我将整个事物包装在一个表单中。然后一些功能起作用而另一些则不起作用我的jQuery仍然有效。

我尝试过重命名功能并确保我拥有;在我所有的功能结束时。我已经使用了控制台，并且每个不起作用的函数都是抛出＆＃34;未捕获的TypeError：对象不是函数＆＃34;错误。

以下是其中一个无效的HTML：

                <td class="tableData"><input type="text" id="teamContact" class="readonly" onfocus="teamContact();" readonly /></td>

和JS一起去吧：

 function teamContact() {
 var singleContact = (document.getElementById('contactTotalSingle').value);
 var numberLO = (document.getElementById('numberOfLO').value);
 var teamTotal = (singleContact * numberLO);
 document.getElementById('teamContact').value = (teamTotal).toFixed(2);

}

还有一点工作HTML：

                <td class="tableData"><input type="text" id="contactRate" class="contactRate"  onchange="calculateSingleContactRate();"/></td>
            <td class="tableData"><input type="text" id="contactTotalSingle" class="readonly" readonly/></td>

它工作的JS：

 function calculateSingleContactRate() {
var contactRate = (document.getElementById('contactRate').value);
var contactPercent = (contactRate / 100);
var leads = (document.getElementById('setSingle').innerHTML);
var contactTotalSingle = (contactPercent * leads);
document.getElementById('contactTotalSingle').value = (contactTotalSingle).toFixed(2);

}

当它不在表单标签之间时，它都可以工作，当它在表单标签中时停止工作。我知道它可能是愚蠢的东西，但我找不到它。

如果您需要更多信息或代码，请与我们联系......

Answer 1

浏览器（遗憾的是，在我看来，但我不打算在风车上倾斜）为每个具有“id”属性的DOM元素创建全局变量（即window对象属性）。根据您导入或声明JavaScript的HTML中的位置，该机制可以覆盖您自己的显式全局符号。

虽然我非常不喜欢这种行为，但它实际上有一线希望：这是一种非常简单的方法来说服人们，浏览器中的全局JavaScript变量比其他语言中的全局变量更加糟糕。

解决问题的一个简单方法是发明一个自己的短全局符号，例如（例如）“A $ L”。不要将事件处理程序声明为简单的全局函数，而是将它们声明为您自己的全局对象的属性：

window.A$L = {};

// ...

A$L.teamContact = function teamContact() {
 var singleContact = (document.getElementById('contactTotalSingle').value);
 var numberLO = (document.getElementById('numberOfLO').value);
 var teamTotal = (singleContact * numberLO);
 document.getElementById('teamContact').value = (teamTotal).toFixed(2);

};

现在，您可以像使用全局一样轻松地使用这些功能：

  <td class="tableData"><input type="text" id="teamContact" class="readonly" onfocus="A$L.teamContact();" readonly /></td>

只要你小心不要引入带有“id”的元素，或以其他方式踩到那个对象，你就会更安全一些。（全局变量很糟糕，但由于浏览器环境的性质，很难完全避免它们。）

Javascript停止使用表单标记

1 个答案: