Блог

Главная - Вопросы по программированию - javascript изменение атрибута стиля нарушает цепочку событий?

javascript изменение атрибута стиля нарушает цепочку событий?

#javascript #html

#javascript #HTML

Вопрос:

У меня есть следующий html:

 <span style="display:none" id="progressBar">HELLO</span>        
<span id="statusPremium">NULL</span>
<span id="statusLink">NULL</span>
<table>
  <tr>
    <td>
      <input type="text" value="12345" onchange="document.getElementById('statusPremium').innerHTML='ONCHANGE';document.getElementById('progressBar').style.display='block';"/>
    </td>
  </tr>
  <tr>
    <td>
      <a href="#" onclick="document.getElementById('statusLink').innerHTML='ONCLICK';">CLICK</a>
    </td>
  </tr>
</table>

Я ввожу элемент ввода, затем редактирую его, а затем нажимаю ссылку. Я ожидаю, что оба текста ie. Появится ONCHANGE ONCLICK. Однако я вижу только ONCHANGE.
Если я удалю:

 document.getElementById('progressBar').style.display='block';

поведение такое, как я и ожидал. Но если затем я удалю все теги table, tr и td, снова останется только ONCHANGE.
Не могли бы вы просветить меня, почему это так работает?

Комментарии:

1. Почему вы все равно хотите использовать эти длинные уродливые встроенные обработчики событий? файлы javascript существуют по какой-то причине

2. Кажется, работает нормально: jsfiddle.net/fmd8xc5q

3. @andrew Извините, но это всего лишь исключение из реального кода, в котором задействованы jsf и гораздо больше тегов. Я старался быть кратким, чтобы описать проблему. Но я был бы признателен, если бы вы предложили более чистую версию. Я не могу согласиться с тем, что ваш пример работает, Мартин Готтвейс, поскольку он представляет тот же симптом, который беспокоил меня. «Onchange» работает всегда нормально. Но «onclick» только тогда, когда «onchange» не установил для свойства «display» значение «block».