Question

美好的一天，

任何人都可以帮助我，当我在表单内的某个输入框上按“输入”时，如何阻止我的表单提交。

我有一个表，其中use可以动态添加/删除行。我还有一个输入框，用户输入/输入要添加的行数。我想要做的是，当用户在添加行输入框中而不实际提交表单时，用户可以按Enter而不是单击添加行按钮。

这是我的js：

$("#toBeAdded").bind("keyup",function(e){
  var code = e.keyCode || e.which;
   if(code == 13) { //Enter keycode
     console.log("enter");
      return false;
     e.preventDefault();
    }

});

我的HTML

<form>
 <div>
 <input name='amout'></amount><input name='qty'></amount>..etc
 </div>

 <input type="text" id="toBeAdded" class="form-control">
  <div class="input-group-btn ">
    <button type="button" id="btnAddRow" class="btn btn-primary ">Add Row</button>
  </div>
 </form>

上面的代码不起作用，它确实显示日志消息，但之后它将提交表单。请有任何想法

Answer 1

将keyup事件更改为keydown

$("#toBeAdded").on("keydown",function(e){

发生后，您无法取消操作。

Answer 2

您在调用preventDefault（）之前从回调返回。切换顺序，它应该工作。

$("#toBeAdded").bind("keyup",function(e){
  var code = e.keyCode || e.which;
  if(code == 13) { //Enter keycode
      console.log("enter");
      e.preventDefault();
      return false;
  }
});

Answer 3

试试这个，在提交之前使用它运行的按键事件，这样你就可以中止：

$('form').find('input').keypress(function(e){
    if ( e.which == 13 ) // Enter key = keycode 13
    {
        return false;
    }
});

阻止表单在表单内某个输入框上的keypress = 13时提交

3 个答案: