检测输入某个类的输入元素 [英] Detect enter in input elements of a certain class

问题描述

我需要检测什么时候有人点击输入文本输入。

我的jQuery如下：

  $（'input.large'）。keypress（function（e）{
 if（e.which == 13）
 console .log（pressed enter）; 
}）; 
  

我的HTML是这样的：

 < tr>< td>个人名称< / td>< / tr> 
< tr>< td> < input type ='text'class ='large'> < / td>< / tr> 
 
< tr>< td>电子邮件< / td>< / tr> 
< tr>< td> < input type ='text'class ='large'> < / td>< / tr> 
  

当我给出字段ID并尝试 $ '）.keypress 它工作。但这不工作。我没有控制台输出。

解决方案

您可以使用live（ on（））事件在文档与 keydown （我想更好）。

HTML ：

 < strong>个人名称< / strong> 
< input type ='text'class ='large'/>< br /> 
 
< strong>电子邮件< / strong> 
< input type ='text'class ='large'/> 
 
  

JS （runnable with jQuery 1.7+）：

  jQuery（document）.on（'keydown'，'input.large'，function（ev）{
 if（ev.which === 13）{
 //会将backgroundColor改为蓝色，例如
 this.style.backgroundColor ='#EFF'; 
 
 //避免form submit 
 return false; 
} 
}）; 
  

jsFiddle ： http://jsfiddle.net/qvhWD/

I need to detect when someone hits "enter" in text inputs with a specific class.

My jQuery is as follows:

$('input.large').keypress(function (e) {
    if(e.which ==13)
        console.log("pressed enter");
});

My HTML is something like this:

<tr><td> Personal Name </td></tr>
<tr><td> <input type='text' class='large'> </td></tr>

<tr><td> Email</td></tr>
<tr><td> <input type='text' class='large'> </td></tr>

When I've given the fields IDs and tried $('#elementid').keypress it worked. But this isn't working. I get no console output. What am I missing?

解决方案

You can use live (.on()) events in document with keydown (I think better). It'll allow you detect keydown in current and future elements that matches with a selector.

HTML:

<strong>Personal Name</strong>
<input type='text' class='large' /><br />

<strong>Email</strong>
<input type='text' class='large' />
​

JS (runnable with jQuery 1.7+):

jQuery(document).on('keydown', 'input.large', function(ev) {
    if(ev.which === 13) {
        // Will change backgroundColor to blue as example
        this.style.backgroundColor = '#EFF';

        // Avoid form submit
        return false;
    }
});​

jsFiddle: http://jsfiddle.net/qvhWD/

这篇关于检测输入某个类的输入元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！