Question

我在laravel应用程序的模板上有这个

GoTo NEXT_NAME

我希望用户能够在输入后按Enter键发表评论。我有<input type="text" class="form-control" placeholder="Post a comment" onkeyup="handleEvt(this, {{$post->id}}, e)"/>函数有三个参数。

第一个参数 - this，用于使用jquery handleEvt()获取输入对象第二个参数 - $(this)用于posts id，最后一个参数（e）用于从键盘捕获事件。

这是我的页脚中的等价函数

{{$post->id}}

我尝试运行此代码，但我没有收到任何警报，也就是说，代码没有按预期工作，请有人帮帮我..

Answer 1

全局事件对象称为event，而不是e。正确的HTML：

<input type="text" class="form-control" placeholder="Post a comment" 
       onkeyup="handleEvt(this, {{$post->id}}, event)" />

如果没有多余的this引用onkeyup="handleEvt(event, {{$post->id}})"：

，它甚至可以更简单

function handleEvt(e, pid) {
    if (e.keyCode === 13) {  // where 13 is the enter button
      var v = e.target.value;
      alert('it is working:' + v);
    }
}

Answer 2

试试这个

 <input name="myComment" type="text" class="form-control" placeholder="Post a comment" />

并在javascript中试试这个

 $(document).keypress(function(e) {
    var comment = $('input[name=myComment]').val();
       if(e.which == 13 && comment !='') {
          alert('clicked');
       }
 });

Answer 3

使用event属性并将其用作第一个这样的参数

<input type="text" class="form-control" placeholder="Post a comment" onkeyup="handleEvt(event,this, 1)"/>

＆＃13;

function handleEvt(e,obj, pid){
    if (e.keyCode === 13) {  //where 13 is the enter button
      v = $(obj).val();
      alert('it is working');
    }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" class="form-control" placeholder="Post a comment" onkeyup="handleEvt(event,this, 1)"/>

＆＃13;

Answer 4

尝试使用e.which。您应该根据浏览器支持检查e.keyCode或e.which。

https://www.w3schools.com/jquery/event_which.asp

https://www.w3schools.com/jsref/event_key_keycode.asp

Answer 5

由于你安装了jquery，我建议使用jQuery来绑定事件。这有助于分离关注点，您无需担心转义参数。如果你这样做：

function handleEvt(e){
    if (e.keyCode === 13) {  //where 13 is the enter button
      v = $(this).val()
      alert('it is working');
    }
}

$(function(){
  $('input').on('keyup', handleEvt)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="form-control" placeholder="Post a comment"/>

它会正常工作。 this绑定到触发事件的元素。

捕获按键并传递值javascript

5 个答案: