使用javascript处理在文本区域上输入密钥

时间:2011-08-22 11:17:18

标签: javascript jquery events textarea

我在页面上有5个文本区域,我希望在第一个文本区域上按Enter键时发生特定事件,而在其他文本区域的输入键上发生不同事件。你能否告诉你如何实现这一目标。

<TextArea></TextArea>
<TextArea></TextArea>
<TextArea></TextArea>
<TextArea></TextArea>
<TextArea></TextArea>

点击第一个文字区域的输入alert('Text Area 1 clicked');

在其他4个文本区域alert ('Other Text Area's clicked');

上按Enter键时

可以使用jquery实现这一点。

3 个答案:

答案 0 :(得分:7)

http://jsfiddle.net/26kN7/1/

$("textarea").keyup(function(e) {
   var code = e.keyCode ? e.keyCode : e.which;
   if (code == 13) {  // Enter keycode
     if($(this).hasClass("first")) {
        alert("first ta clicked");
     } else {
         alert("the other ta clicked");
     }
   }
});

在某些版本的FFX中按<Tab>,e。未设置(保持为0),但e.keyCode为(9)。

你也可以将其缩短为

$("textarea").keyup(function(e){
    if((e.keyCode || e.which) == 13) { //Enter keycode
      if($(this).hasClass("first")) {
        alert("first ta clicked");
      } else {
        alert("the other ta clicked");
      }
    }
});

另一个注意事项是我喜欢在这里添加类而不是找到第一个textarea是cos这是更通用的解决方案并且可以迎合任何textareas。

答案 1 :(得分:3)

您可以尝试使用:

$('textarea').keypress(
    function(e){
        if (e.keyCode == 13) {
            if ($(this).index() == 0) {
                // code for first textarea;
            }
            else {
                // code for others
            }
        }
    });

JS Fiddle demo

答案 2 :(得分:1)

检查which property of the jQuery event object以确定按下了哪个键。

$('textarea').first().keypress(function (e)
{
    if (e.which === 13) alert('Text Area 1 enter key pressed');
}).nextAll().keypress(function (e)
{
    if (e.which === 13) alert('Other Text Area enter key pressed');
});