Несовместимые результаты функции JavaScript

Question

У меня есть эта функция в моем коде Javascript, которая обновляет 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, тогда поле стоимости обновляется корректно. Это должно быть проблемой с вызванной функцией.

Примечание: мы знаем, что функция выполняется, потому что она выполняет 5 из 6 операций, которые она должна делать. Это странная проблема.

Редактировать: пастбина для всей страницы может быть полезным. Вот оно:

http://pastebin.com/f70d584d3

Answer 1

Мой опыт работы с getElementById был в лучшем случае смешанным, и это, скорее всего, ваша проблема. Возможно, какая-то ошибка DOM в браузере, когда у вас есть два элемента с одинаковым идентификатором или что-то в этом роде.

Я использую Prototype , который позволяет вам избежать двусмысленностей и привередливых браузеров простым вызовом:

document.getElementById('bf')

становится

$('bf')

Аналогичным образом вы можете легко обновить innerHTML элемента:

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

Проверьте это. Это спасло мой бекон больше, чем пару раз.

Answer 2

Мне любопытно, возможно ли, что на самом деле есть 2 элемента с идентификатором "стоимость"? Это может, обновляя первый найденный, вызвать эту проблему. Разные браузеры могут по-разному реализовывать document.getElementById (), поэтому вы можете получить еще более противоречивые результаты в разных браузерах, если это так.

ОБНОВЛЕНИЕ: Оказывается, вам нужно вызвать bill.holiday () или bill.unholiday () перед вызовом updateFields () при втором выборе.

Answer 3

Теперь я понимаю, почему решение Эрика сработало ... что привело меня к лучшему решению.

Его сообщение по какой-то причине было удалено, но я прокомментировал его другой пост, перефразируя его ответ.

В любом случае, Он сказал, чтобы позвонить праздник () или unholiday (). Когда вы посмотрите на эти функции, вы увидите в последней строке кода:

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

Тогда все начинает обретать смысл. Раньше я просто устанавливал pointPartOfWeek на новое значение и двигался дальше. но pointPartOfDay - это просто адрес массива. Я никогда не обновлял стоимость комнаты. Это также объясняет, почему стоимость со временем корректируется. Пока pointPartOfWeek не изменяется, вызовы setRoom будут по-прежнему фиксировать сумму (даже в другом событии).

Веселье отладки ...

Answer 4

Проблема в том, что свойство стоимости объекта биллиарда не было обновлено при вызове updateFields (). Вам нужно вызвать bill.calculate (), который обновляет свойство cost.