Question

我有一个简单的表单，如下所示：

<form action="#" name="submit" method="post">
        <input name="zip" id="zip" type="text" value="" class="zip-start" />
        <div class="form-submit"><a href="" id="zipformSubmit" rel="zipformSubmit" class="zipformSubmit">Submit</a></div>
    </form>

我的JS看起来像这样：

<script> 
    $(document).ready(function() { 
    $("a[rel=zipformSubmit]").click(function(e) { 
        e.preventDefault();
         var zip = $('#zip').val();
         if (zip.length < 5) { alert("Please enter a valid zip code"); return false;};
        $.colorbox({href: "/ppc/form.htm?zip=" + zip, iframe:true, innerWidth:800, innerHeight:600}); 
    }); 
    });  
</script>

问题是用户只能通过单击提交按钮来提交此表单。关于我如何调整js以便输入按钮也提交表单的任何想法？

提前致谢

Answer 1

使用jQuery的submit ^[docs]方法通过点击输入来收听表单提交。

<script> 
    function submitHandler(e) {
        e.preventDefault();
        var zip = $('#zip').val();
        if (zip.length < 5) { alert("Please enter a valid zip code"); return false;};
        $.colorbox({href: "/ppc/form.htm?zip=" + zip, iframe:true, innerWidth:800, innerHeight:600});
    }

    $(document).ready(function() { 
        $('form').submit(function(e) {
            submitHandler(e);
        });

        $("a[rel=zipformSubmit]").click(function(e) { 
            submitHandler(e);
        }); 
    });  
</script>

但是，您应该将此$('form')更改为更具体的内容。为表单添加一个id，它应该是完美的。

Answer 2

您是否尝试过使用$(...).submit()？

jquery make enter按钮提交表单

2 个答案: