Question

我想在用户点击表格的div旁边时自动提交表单。

我尝试了以下内容，但是在div中单击提交。

<div id="formDiv">
<form id="search">
  <input id="target" type="text" value="Field 1" />
  <input type="text" value="Field 2" />
</form>
</div>

// auto submit 
jQuery('#formDiv').live('blur',function() { 
    $(this).children('form').submit();

    });

Answer 1

副手，我唯一能建议的是附加到身体的点击事件，然后附加到div的点击事件和e.preventDefault()以停止它。或者，您可以使用.delay绑定到每个表单元素的焦点/模糊事件。如果他们从一个元素中失去焦点而不在另一个元素中，请提交表单。

修改

看看这是否是您正在寻找的：

使用Javascript：

var queueSubmit; $('#sample input').each(function(i,e){ $(this).bind('focus',function(){ clearTimeout(queueSubmit); }); $(this).bind('blur',function(){ queueSubmit = setTimeout(function(){ $('#sample').submit(); }, 1000); }); }); $('#sample').bind('submit',function(){ clearTimeout(queueSubmit); alert('Pseudo-Submitted!'); return false; });

示例HTML

<div id="main"> <p> </p> <div id="main-form"> <form id="sample" method="POST" target=""> <fieldset> <legend>My Sample Form</legend> First Name: <input type="text" id="first_name" /><br /> Last Name: <input type="text" id="last_name" /><br /> Telephone: <input type="text" id="telephone" /><br /> <input type="submit" value="Submit" /> </fieldset> </form> </div> <p> </p> </div>

Working Example Here

Answer 2

我会通过在主体上放置一个点击处理程序并查看事件目标（event.target）是否为#formDiv的后代元素来实现此目的：

$('#search').one('focus', function() { // the first time that a field in #search receives focus
    var $formDiv = $('#formDiv');
    $(document.body).click(function(e) { // bind a click handler to the document body
        if (!$formDiv.has(e.target).length) { // if the target element is not within formDiv
            $('#search').submit(); // submit the form
        }
    });
});

JQuery表单自动提交点击侧面div

2 个答案: