Question

我在我的Javascript代码中有这个功能，无论何时调用html字段，都会用新值更新html字段。问题不在于函数本身，因为除了一个部分之外，它在每个部分都能很好地工作。这是JS函数：

  function updateFields() {
    document.getElementById('bf').innerHTML = bill.time[breakfast][bill.pointPartOfWeek];
    document.getElementById('ln').innerHTML = bill.time[lunch][bill.pointPartOfWeek];
    document.getElementById('dn').innerHTML = bill.time[dinner][bill.pointPartOfWeek];
    document.getElementById('se').innerHTML = bill.time[special][bill.pointPartOfWeek];
    document.getElementById('fdr').innerHTML = bill.time[full][bill.pointPartOfWeek];
    document.getElementById('cost').innerHTML = bill.cost;
  }

它在以下实例中执行正常：

  <select onchange='if(this.selectedIndex == 0) {bill.unholiday();updateFields()} else { bill.holiday();updateFields()}' id='date' name='date'>
    <option value='else'>Jan. 02 - Nov. 20</option>
    <option value='christmas'>Nov. 20 - Jan. 01</option>
  </select>

但是在这个非常相似的代码中，函数的最后一行似乎没有执行（它不会更新成本字段，而是更新其他所有内容）

  <select onchange='if(this.selectedIndex == 0) {bill.pointPartOfWeek = 1;} else { bill.pointPartOfWeek = 2;}updateFields();alert(updateFields());' id='day' name='day'>
    <option value='0'>Monday thru Thursday</option>
    <option value='1'>Friday, Saturday, or Sunday</option>
  </select>
  <br />

奇怪的是，总成本变量本身已更新，但表示变量的字段不是。如果您使用页面的另一部分不会更改总费用的值但再次调用updateFields函数，则费用字段会正确更新。它必须是调用函数的问题。

注意：我们知道该函数的执行是因为它执行了6项中的5项。这是一个奇怪的问题。

编辑：整个页面的pastebin我很有帮助。这是：

http://pastebin.com/f70d584d3

Answer 1

我很好奇，是否有可能实际上有2个ID为“cost”的元素？通过更新它找到的第一个，可能会导致此问题。不同的浏览器可能有不同的方法来实现document.getElementById（），因此如果是这种情况，您可能会使用不同的浏览器获得更多不一致的结果。

更新：事实证明你需要在第二次选择中调用updateFields（）之前调用bill.holiday（）或bill.unholiday（）。

Answer 2

我对getElementById的体验充其量是混合的，这很可能是你的问题。可能是某种浏览器DOM错误，你有两个具有相同ID的项目，或类似的东西。

我使用Prototype，通过简单的调用，您可以避免歧义和挑剔的浏览器：

document.getElementById('bf')

变为

$('bf')

同样，您可以轻松更新元素的innerHTML：

$('bf').update(bill.time[breakfast][bill.pointPartOfWeek]);

检查出来。它拯救了我的培根几次。

Answer 3

问题是当您调用updateFields（）时，台球对象的cost属性尚未更新。您需要调用bill.calculate（）来更新成本属性。

Answer 4

我现在明白为什么Eric的解决方案有效......这使我找到了更好的解决方案。

他的帖子由于某种原因被删除了，但我评论了他的另一篇文章，解释了他的答案。

反正，他说要打假（）或假期（）。当你看到最后一行代码中你会看到的那些函数时：

this.setRoom(this.pointPartOfDay,this.pointPartOfWeek);

然后一切都开始变得有意义了。之前，我只是将pointPartOfWeek设置为其新值并继续前进。但是pointPartOfDay只是一个数组地址。我从未真正更新过房间费用。这也解释了为什么成本最终会自我纠正。只要pointPartOfWeek没有改变，调用setRoom仍然会修复金额（即使在另一个事件中）。

调试的乐趣......

JavaScript函数结果不一致

4 个答案: