JavaScript. Потеря значения переменной, связанной с полем формы после изменения этого поля другим скриптом
Простая ситуация - на одной HTML-странице работают два JS-скрипта и обрабатывают одно общее поле формы.
После записи значения в поле одним скриптом, переменная в другом скрипте, содержащая ссылку на это поле становится not defined.
Почему? Нормальное ли такое поведение, и как "стандартно" в данном случае можно не терять значение и связь с HTML-элементом?
HTML:
<input type="hidden" id="loc-value" value="123" />
1-й JS-скрипт:
// использует значение поля "loc-value"
let loc_value = document.getElementById("loc-value").value; // в глобальной области видимости
...
2-й JS-скрипт:
// меняет значение в поле "loc-value" после прочтения 1-м скриптом
document.getElementById('loc-value').value = '987';
...
После записи значения в поле переменная 1-го скрипта становится необъявленной. Область видимости не является причиной. Скрипты работают независимо друг от друга.
Ответы (2 шт):
После выполнение первого скрипта значение loc_value становится 123
После выполнение второго скрипта значение loc_value остается 123
Ошибка not defined нужно искать не в этих строчках
Чтоб обновить loc_value до текущего значения можно сделать функцию
function updateValue(){
loc_value = document.getElementById("loc-value").value;
}
и вызвать её после второго скрипта
Но ошибка not defined как раз может быть связана с областью видимости что переменная не определена (не значение)
Тест пример https://codepen.io/-greg-/pen/OJNRmWb
Чтоб найти ошибку нужно больше данных
Навскидку решено простым перечитыванием поля непосредственно перед применением этого значения.
loc_value = document.getElementById("loc-value").value; // обновление переменной