0

我很难找到一种跨浏览器兼容、基于 Javascript 的方法来将函数附加到元素。微软(当然)似乎又一次有了自己的做事方式,并且很难做到这一点。基本上,我在 Javascript 中动态创建一个表格,并将 TEXTAREA 元素添加到行中的单元格中。我需要为 TEXTAREA 的 onkeydown 添加一个函数,以便检查文本框的长度是否达到最大限制(不幸的是,TEXTAREA 元素不支持 MaxLength 属性)。

是否存在适用于 FF 和 IE6、IE7、IE8 和 IE9 的简单解决方案?

4

3 回答 3

1

我建议你看看jQuery。一个例子是

$('textarea').keydown(function () { });

请注意,在此示例中,我将事件处理程序附加到每个文本区域。更好的方法是使用 css 类或其他更具体的选择来找到正确的文本区域。例如:

$('textarea.limitedlength').keydown(function () { });

另请注意,您应该在创建元素后执行此操作。如果您不想打扰时间,请使用 live 函数,然后 jQuery 会将事件处理程序附加到任何新找到的元素。

$('textarea.limitedlength').live('keydown', function () { });

好处是任何跨浏览器的问题都由框架处理。(我不知道 keydown 事件有任何跨浏览器问题,但 jQuery 处理了设置事件处理程序和选择正确元素方面的差异)。

正如 RobG 在他的回答中指出的那样,由于粘贴,keydown(和 keyup 事件)是不够的。另一种方法是计算并检查焦点何时从文本区域中移除:

$('textarea.limitedlength').blur(function () { });
于 2011-05-12T20:57:55.410 回答
1

使用键事件检查 textarea 内容的问题在于还有其他输入文本的方法,例如粘贴或拖动。许多人使用setIntervalsetTimeout来检查内容并不时更新计数(例如 50 毫秒),但这种方法在计算上可能效率低下。只有当 textarea 具有焦点时,您才能让计时器运行。

还有一种 HTML5input事件类型会在表单控件有输入时触发:

<textarea oninput="document.getElementById('msg').innerHTML = this.value.length;">
</textarea>
<div id="msg"></div>

但当然不是所有的浏览器都支持。

于 2011-05-13T01:06:28.877 回答
0

除非您需要附加多个事件侦听器,否则这可以正常工作:

element.onkeydown = function(e)
{
    e = e || window.event;
    ...
}
于 2011-05-12T20:57:56.720 回答