最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - jQuery Event Keypress: Enter key - Stack Overflow

programmeradmin0浏览0评论

i have a combo box which has got values and i want to give the user to select the values when the Enter key pressed.

  1. User can navigate through Arrow key
  2. Select the value when user enters Enter key.

I have done this one :

$('#cmb_CIMtrek_DailyshipCo_CustomerName select').bind('keypress', function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
     if(code == 13) { //Enter keycode
       //Do something
         alert("Enter key Pressed");
     }
});

but is not giving alert when I press Enter key.

What could be the problem and how to solve it?

Best Regards.

i have a combo box which has got values and i want to give the user to select the values when the Enter key pressed.

  1. User can navigate through Arrow key
  2. Select the value when user enters Enter key.

I have done this one :

$('#cmb_CIMtrek_DailyshipCo_CustomerName select').bind('keypress', function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
     if(code == 13) { //Enter keycode
       //Do something
         alert("Enter key Pressed");
     }
});

but is not giving alert when I press Enter key.

What could be the problem and how to solve it?

Best Regards.

Share Improve this question edited Jan 28, 2013 at 7:34 ıllıllı lק ıllıllı 8082 gold badges19 silver badges40 bronze badges asked Jan 28, 2013 at 7:24 Java QuestionsJava Questions 7,95343 gold badges119 silver badges177 bronze badges 5
  • 1 I don't think it's the problem you're having, but this is unnecessary with jQuery: var code = (e.keyCode ? e.keyCode : e.which); jQuery normalizes the which value for you. – T.J. Crowder Commented Jan 28, 2013 at 7:26
  • Try on keyup. From the jQuery docs: "The keypress event isn't covered by any official specification, the actual behavior encountered when using it may differ across browsers, browser versions, and platforms." – elclanrs Commented Jan 28, 2013 at 7:27
  • Pressing enter in some html input elements will cause the form to submit or at least the onsubmit to be triggered (Firefox will trigger the input type submit onclick as well). If this is the case you might want to use preventDefault on the event object: api.jquery.com/event.preventDefault – HMR Commented Jan 28, 2013 at 7:36
  • @HMR FYI no such behaviour in HTML5 on select tags: jsfiddle.net/CNad7/1 and Anto the thing you want to achieve is already supported by default with select tag – Talha Akbar Commented Jan 28, 2013 at 7:39
  • @AspiringAqib it is not working that is the reason why the post is here. – Java Questions Commented Jan 28, 2013 at 7:42
Add a comment  | 

4 Answers 4

Reset to default 9
 <select>
    <option value="1">1</option>
    <option value="2">2</option>
 </select>     

 <script> 
 $('select').live('keypress',function(e){
     var p = e.which;
     if(p==13){
         alert('enter was pressed');
     }
 });
 </script>

Try this one

$('#cmb_CIMtrek_DailyshipCo_CustomerName select').keypress(function(event){

        var keycode = (event.keyCode ? event.keyCode : event.which);
        if(keycode == '13'){
            alert('You pressed a "enter" key in textbox');  
        }
        event.stopPropagation();
    });

If you want to post the form when the user presses enter you could also use a submit button which has this behaviour as a default.

If you don't want to post the form but do have a submit button, this might catch the key event and doesn't propagate.So remove any submit-button.

To restrict the event to an object use:

if (e.target == document.getElementById('element-id'))

or jquery

if (this == $('#element-id').get(0))

Your code would look something like this:

$(document).bind('keypress', function(e) 
    {
    // Use 'this' or 'e.target' (whithout quotes)
    if (this == $('#cmb_CIMtrek_DailyshipCo_CustomerName select').get(0))
        {
        var code = (e.keyCode ? e.keyCode : e.which);
        if(code == 13)
            { //Enter keycode
            //Do something
            alert("Enter key Pressed");
            }
        }
    // Stop the event from triggering anything else
    e.stopPropagation();
    });

For example:

<!html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>

<div class="form-group">
    <label for="exampleFormControlSelect1">Bodega</label>
    <select class="form-control" id="exampleFormControlSelect1">
      <option value="despacho">Despacho</option>
      <option value="ventas">Ventas</option>
    </select>
</div>

 <script>
     $('#exampleFormControlSelect1').on('keypress',function(e){
         var p = e.which;
         if(p==13){
             alert('enter was pressed');
         }
     });
 </script>

发布评论

评论列表(0)

  1. 暂无评论