Question

我看过许多类似的问题，但也许我不明白如何调用我的功能。

我的目标是允许用户输入表单字段并按Enter键提交。

目前，如果有人在表单中输入值，则单击“输入”将不执行任何操作。要执行，他们必须单击“搜索库存”按钮。

我的搜索表单简化了...有很多字段，都有一类jquerydata。类inventory_search_db_connect绑定到一个jQuery函数，该函数使用jquerydata作为一个类来收集所有内容并完成它。

<form method="post"  action="" name="form3" id="form3">
<input type=text name="title" size=25 value="" class="jquerydata">
<input type=button class="inventory_search_db_connect" value="   Search Inventory" class="jquerydata">
</form>

javascript / jQuery

$(document).ready(function () {
pageBinds.db_actions();
SearchBinds.search_actions();
});


var pageBinds = {

db_actions: function() {
var that = this;
 $('.inventory_functions_db_connect').on(
      'click', function(event){


          var query= $(this).closest('.parent').find('.jquerydata').serialize();

....does stuff here
  );
},
unbind: function() {
$('.inventory_functions_db_connect').off();
this.db_actions();
}

}

我尝试了几件事，我可能会工作的是

$(document).ready(function() {

$('#form3').on("submit", function() {
    this.db_actions();
});
});

在表单标签上我添加了

<form method="post"  action="" name="form3" id="form3" onsubmit="return false">

因为我在这里，这显然不起作用。

还有许多其他解决方法，但我无法破译如何调用我想要的功能。

提前感谢任何见解...... 麦克

Answer 1

在html中删除onsubmit =＆＃34;返回false＆＃34; 因为它阻止执行

$('#form3').on("submit", function() {
   this.db_actions();
});

然后在JS中你必须通过调用preventDefault（）来阻止自动提交：

$('#form3').on("submit", function(e) {
    e.preventDefault();
    this.db_actions();
 });

编辑：

this.db_actions();

不起作用，因为这是DOM元素所以

$('#form3').on("submit", function() {
   pageBinds.db_actions();
});

让我知道这是否有效;）

Answer 2

试试这个：

$('input').keypress(function(e) { 
if (e.which = 13) 
{ 
this.db_actions();
}
});

或

$('input').keydown(function (e) {
    if (e.keyCode == 13) {
        this.db_actions();
    }
});

或者

$("input").keypress(function (e) {
    if (e.which == 13) {
        e.preventDefault();
        $("form").submit();
    }
});

Answer 3

感谢您的回复。 @Alan Wagner带领我朝着正确的方向前进。

我最后添加了一个隐藏的提交按钮，其中的类与单击要提交的按钮相同。这与函数绑定。

<input type="submit" class="inventory_search_db_connect" style="display: none;">

然后在我添加的功能中

event.preventDefault();

停止自动提交

谢谢，我希望这最终有助于其他人麦克

从没有提交按钮的提交按钮提交到jQuery没有表单操作

3 个答案: