Как передать / экранировать аргумент к обработчику событий, прикрепленному с помощью javascript?
В коде HTML+Script ниже,
- обработчик событий присоединяется после загрузки страницы с помощью
setAttribute(...), - Передатчику события передается аргумент, который также читается динамически.
- Организатор события успешно прикреплен (подтверждено
getAttribute(...)
Однако обработчик не срабатывает.
Что не так с фрагментом ниже?
<HTML>
<BODY onload="loader();">
<table>
<tbody>
<tr>
<td id="myId">FirstColumn</td>
<td id="otherId">SecondColumn</td>
<td id="lastId">Balderdash</td>
</tr>
</tbody>
</table>
</BODY>
<script language="javascript">
function loader(){
document.getElementById('myId').setAttribute('onmouseover','showMessage("'+document.getElementById('otherId').innerHTML+'");');
alert(document.getElementById('myId').getAttribute('onmouseover'));
document.getElementById('myId').setAttribute('onmouseout','alert(\"'+document.getElementById('otherId').innerHTML+'\");');
alert(document.getElementById('myId').getAttribute('onmouseout'));
document.getElementById('lastId').setAttribute('onmouseout','alert("hohoho");');
alert(document.getElementById('lastId').getAttribute('onmouseout'));
function showMessage( aMessage ){
alert(aMessage);
}
</script>
</HTML>
2 ответа
Решение
Пост Тима там помог мне понять это; хотя мое понимание эмпирически.
В дополнение к прямому назначению
например
document.getElementById(...).onMouseOver = stuff;
function stuff(){//do the Deed};
вместо
document.getElementById(...).setAttribute(...);
Видимо, прикрепленный обработчик событий может не принимать никаких аргументов.
Я изменил свои подписи обработчика, чтобы принять 0 аргументов, и это работает!
Не использовать setAttribute установить обработчики событий на узлах DOM. Просто используйте свойство обработчика события direct и назначьте ему функцию, а не строку:
document.getElementById('myId').onmouseover = function() {
showMessage(document.getElementById('otherId').innerHTML);
};