Jquery: how to trigger click event on pressing ent

2019-01-10 05:20发布

站内问答 / jQuery
1368 10 4

I need to execute a button click event upon pressing key enter.

As it is at the moment the event is not firing.

Please Help me with the syntax if possible.

$(document).on("click", "input[name='butAssignProd']", function () {
   //all the action
});

this is my attempt to fire click event on enter.

$("#txtSearchProdAssign").keydown(function (e) {
  if (e.keyCode == 13) {
    $('input[name = butAssignProd]').click();
  }
});

10条回答
成全新的幸福
2楼-- · 2019-01-10 05:45

try out this....

$('#txtSearchProdAssign').keypress(function (e) {
 var key = e.which;
 if(key == 13)  // the enter key code
  {
    $('input[name = butAssignProd]').click();
    return false;  
  }
});   


$(function() {

  $('input[name="butAssignProd"]').click(function() {
    alert('Hello...!');
  });

  //press enter on text area..

  $('#txtSearchProdAssign').keypress(function(e) {
    var key = e.which;
    if (key == 13) // the enter key code
    {
      $('input[name = butAssignProd]').click();
      return false;
    }
  });

});
<!DOCTYPE html>
<html>

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
  <meta charset=utf-8 />
  <title>JS Bin</title>
</head>

<body>
  <textarea id="txtSearchProdAssign"></textarea>
  <input type="text" name="butAssignProd" placeholder="click here">
</body>

</html>

Find Demo in jsbin.com

查看更多
0人赞 添加讨论(0) 举报
我欲成王，谁敢阻挡
3楼-- · 2019-01-10 05:47

Are you trying to mimic a click on a button when the enter key is pressed? If so you may need to use the trigger syntax.

Try changing

$('input[name = butAssignProd]').click();

to

$('input[name = butAssignProd]').trigger("click");

If this isn't the problem then try taking a second look at your key capture syntax by looking at the solutions in this post: jQuery Event Keypress: Which key was pressed?

查看更多
0人赞 添加讨论(0) 举报
Summer. ? 凉城
4楼-- · 2019-01-10 05:47

Another addition to make:

If you're dynamically adding an input, for example using append(), you must use the jQuery on() function.

$('#parent').on('keydown', '#input', function (e) {
    var key = e.which;
    if(key == 13) {
        alert("enter");
        $('#button').click();
        return false;
    }
});

UPDATE:

An even more efficient way of doing this would be to use a switch statement. You may find it cleaner, too.

Markup:

<div class="my-form">
  <input id="my-input" type="text">
</div>

jQuery:

$('.my-form').on('keydown', '#my-input', function (e) {
  var key = e.which;
  switch (key) {
  case 13: // enter
    alert('Enter key pressed.');
    break;
  default:
    break;
  }
});
查看更多
0人赞 添加讨论(0) 举报
放我归山
5楼-- · 2019-01-10 05:47

This appear to be default behaviour now, so it's enough to do:

$("#press-enter").on("click", function(){alert("You `clicked' or 'Entered' me!")})

You can try it in this JSFiddle

Tested on: Chrome 56.0 and Firefox (Dev Edition) 54.0a2, both with jQuery 2.2.x and 3.x

查看更多
0人赞 添加讨论(0) 举报
一纸荒年 Trace。
6楼-- · 2019-01-10 05:49

You were almost there. Here is what you can try though.

$(function(){
  $("#txtSearchProdAssign").keyup(function (e) {
    if (e.which == 13) {
      $('input[name="butAssignProd"]').trigger('click');
    }
  });
});

I have used trigger() to execute click and bind it on the keyup event insted of keydown because click event comprises of two events actually i.e. mousedown then mouseup. So to resemble things same as possible with keydown and keyup.

Here is a Demo

查看更多
0人赞 添加讨论(0) 举报
别忘想泡老子
7楼-- · 2019-01-10 05:50

Just include preventDefault() function in the code,

       $("#txtSearchProdAssign").keydown(function (e) {
       if (e.keyCode == 13) {
       e.preventDefault();
       $('input[name = butAssignProd]').click();
        }
        });
查看更多
0人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)