Javascript 如何防止自动表单提交

Javascript 如何防止自动表单提交,javascript,jquery,ajax,Javascript,Jquery,Ajax,我有下面的输入框,它接受条形码扫描仪的输入 <form class="m-form m-form--fit m-form--label-align-right" method="post" action="{{ url('updateInvoice') }}" id="invoice_update"> <div class="form-group m-form__group"> <label for="exampleInputEmail1"&

我有下面的输入框,它接受条形码扫描仪的输入

 <form class="m-form m-form--fit m-form--label-align-right" method="post" action="{{ url('updateInvoice') }}" id="invoice_update">
    <div class="form-group m-form__group">
       <label for="exampleInputEmail1">Search by item name or barcode</label>
       <input type="text"  autofocus class="form-control m-input" id="productSearch"  placeholder="Item name">              
    </div>
     <button type="submit" name="pdf" class="btn btn-success">Update & print
     </button>
</form>

按项目名称或条形码搜索
更新和打印
从条形码获取输入后,它执行以下操作(从输入检查数据库中的值并添加到行)

$(“#产品搜索”).change(函数(事件){
event.preventDefault();
$.ajax({
键入:“获取”,
背景:这,,
url:“{!!资产('searchByProductName')!!}”,
数据类型:“json”,
数据:{name:this.value},
成功:功能(响应)
{
if($('#'+response.id).length!==0)
{$(this.val(“”.focus();返回false;}
var markup=“”+响应。产品名称+“”+响应。产品单价+“”+响应。产品单价+“”+响应。注释+“”;
$(“表tbody”)。追加(标记);
$(this.val(“”.focus();返回false;
} 
});
});

但是表单自动提交的问题是,我不能在表中添加多个值。如何防止表单自动提交,以便使用上述ajax代码进行多个输入?

我不确定条形码扫描仪是否输入了“回车键”,但这一个如何

$("#form-id").on("submit", function(e) {
    if ($("#input-id(productSearch)").is(":focus")) {
        e.preventDefault();
    }
});

在我看来,最简单的方法是添加一个隐藏的输入

<input type="hidden" />


如果表单中有一个输入,浏览器将自动提交。

从按钮中删除
type=“submit”
,然后单击
onclick
javascriptlistner@DeepakPatel这不是正确的选项您不能在表中添加多个值是什么意思?每当输入框中充满条形码扫描仪时。表格必须提交。这就是为什么我不能从上面的输入框中添加更多内容
<input type="hidden" />