Question

我正在尝试将一个事件动态地应用到我的应用程序中。

当我使用onclick时，我会收到弹出警告。

el.setAttribute('onclick', 'alert("hi")',0);

当我尝试使用onkeypress时，没有任何事情发生。

el.setAttribute('onkeypress', 'alert("Hi");',0);

我真的需要提供onkeypress。有什么东西我做错了吗？ setAttribute不是实现我正在做的事情的最佳方式吗？如果是这样，我在动态设置特定元素上的事件的替代方法是什么？

更新：

当我这样做时，回答以下几个问题：

el.setAttribute('onkeypress','numericOverride(this)',0);

当我在Firebug中查看源代码时，我会看到以下内容：

<div id="objSCR" class="txtbox" onmousedown="pfocus(this, '', '');" style="color:#0000FF; width:62px; height:12px; top:76px; left:120px; text-align:right; color:#0000FF;" ptmulti="false" pttype="E" ptlayndx="4" ptdisp="false" ppopup="" plength="12" onchange="numericOverride(this)">4000.00</div>

然而，当我改变文本的值时，我现在从这个函数输出：

function numericOverride(val){
        console.log('hello');
}

当我尝试执行以下操作时：

el.onchange = function() { numericOverride(this) }

没有任何东西被添加到div中，我从该函数中得不到任何结果。

Answer 1

您尝试将事件处理程序附加到的元素类型是什么？ onkeypress事件仅受以下标记支持：

<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>,
<caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, <fieldset>, <form>,
<h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, <li>, <map>, <object>, <ol>,
<p>, <pre>, <q>, <samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>,
<tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, <tr>, <tt>, <ul>, <var>

http://www.w3schools.com/jsref/event_onkeypress.asp

Answer 2

试试这个（它的跨浏览器）：

function keyPressHandler() { alert("Hi"); };

if (el.addEventListener) {
   el.addEventListener("keypress", keyPressHandler, true);
}
else if (el.attachEvent) {
   el.attachEvent("onkeypress", keyPressHandler);
}
else {
   el.onkeypress = keyPressHandler;
}

演示（注意jsfiddle在IE 7中效果不佳）：http://jsfiddle.net/mrchief/BQxWp/2/

Chrome，FF5，IE7（重试几次后）和IE9中的

经过测试。

Answer 3

你应该以正确的方式设置事件监听器：

el.onkeypress = function() { alert("HI") }

Answer 4

您是否考虑过使用event listeners？

target.addEventListener("click", function() { alert("Hi"); })

javascript setAttribute动态

4 个答案: