Question

我有一个包含多个表单的页面。一个表单（参见下面的示例）有一个输入，用于向页面上的表添加行。可以选择（复选框）打开/关闭表中的每一行。另一个表单提交页面，将哪些行“打开”到下一页。

所以，最初的问题是人们输入一个网址并点击返回将其添加到表格中，而不是添加它，而是提交“其他”表单（mainForm）。

所以，我在下面添加了jQuery。这解决了问题 - 现在，当url字段处于焦点并且单击return时，它会向列表中添加一个url并且不提交mainForm。

但是，当该字段未处于焦点时，按下return不会做任何事情 - 当我希望它提交表单时（默认行为）...因为事件仅附加到那个输入字段。

HTML（大大简化）：

<form name="data>
 <input id="url" class="field" type="text" size="65" name="urlText">
 <input class="hubField" type="button" value="Add Url" name="urlAddButton">
 <table>
    <tr>
       <td><input type="checkbox"></td>
       <td>Description text</td>
       ....and so on...
 </table>
</form>

<form name="mainForm">
 <input type="SUBMIT" value="Load Selected Urls" name="Submit">
</form>

JS / jQuery的：

$(document).ready(function() {
    $('#url').bind('keyup',function(e) {
        if (e.which == 13) {
        $('input[name="urlAddButton"]').focus().click();
        e.preventDefault();
        }
    })
});

我对jQuery很新，所以要好。 ;-)在js我可能只是写一些东西，如果该字段不在焦点并按下返回，请提交主表单。在JQuery中有更好的方法吗？

Answer 1

如果我理解，当用户在“url”输入中而不是时按Enter键时，您想要提交mainForm。当他进来时，你触发点击“urlAddButton”。如果是这样，这里有一个关于jsFiddle的工作示例：http://jsfiddle.net/MUUUE/

$(document).ready(function(){
    $(this).bind('keydown',function(e) {//keyDOWN (for the input)
        if(e.which == 13) {//if enter is pressed
            if(e.target.id == "url"){//and we're in the url input
                 $('input[name="urlAddButton"]').focus().click();
                 e.preventDefault();
            }
            else if(e.target.type != "textarea" && e.target.type != "text"){//else, we submit the main form (if we're not in another input or textarea)
                $("#mainForm").submit();//id attr added in the html code
            }
        }
    })
});

但是，最后，我不确定在你没有投入的情况下提交表格是如此的好。

Answer 2

给你要提交id的表单（“mainform”），然后使用$('#mainform').submit();我意识到你可以根据name属性定位该表单，但使用id要快得多，前提是你有控制标记。

查看文档了解更多信息。 - http://api.jquery.com/submit/及其提供的样本

$(document).ready(function() {
    $('#url').bind('keyup',function(e) {
        if (e.which == 13) {
            $('#mainform').submit();
            e.preventDefault();
        }
    })
});

jQuery - 在返回时提交一个表单，在返回另一个表单时禁用提交

2 个答案: