Question

我试图将一个简单的函数绑定到一个提交事件，即：

检索所有输入字段的值
设置表单
提交表格

受this answer的启发 - 我想出了以下代码：

$(document).ready(function() {
    $('#fbook').bind('submit', function(event) {
        event.preventDefault();
        var baseURL = $(this).children('#base').val();
        var hotelID = $(this).children('#destination').val();
        var dateIn = $(this).children('#show-date-in').val();
        var location = baseURL + "&hotelID=" + hotelID + "&dateIn=" + dateIn;
        $(this).attr('action', location);
        $(this).submit();
    });
});

这是jsFiddle与HTML和JS：http://jsfiddle.net/mattvic/2wRHc/47/

不幸的是它不起作用，我只是看不到我错在哪里。我希望有人能发现错误。

非常感谢！

Answer 1

您的代码将进入无限循环，因为$(this).submit()调用绑定到表单元素的提交处理程序，这会触发调用$(this).submit()的处理程序，该处理程序调用绑定到表单元素的提交处理程序等等。

如果您使用表单自己的submit方法，则可以避免递归：

this.submit();

Answer 2

由于表单包含submit类型的按钮，因此您的$(this).submit()无法正常工作。相反，请尝试以下方法 -

$(document).ready(function() {

    $('#booking-button').click(function(event)
    {
        event.preventDefault();
        var baseURL = $("#fbook").children('#base').val();
        var hotelID = $("#fbook").children('#destination').val();
        var dateIn = $('#show-date-in').val();
        var location = baseURL + "&hotelID=" + hotelID + "&dateIn=" + dateIn;
        $("#fbook").attr('action', location);
        $("#fbook").submit();
    });
});

jsfiddle示例。

Answer 3

将您的jQuery更改为：

$(document).ready(function() {
    $('#fbook').submit(function(event) {
        var baseURL = $('#base', this).val();
        var hotelID = $('#destination', this).val();
        var dateIn = $('#show-date-in', this).val();
        var location = baseURL + "&hotelID=" + hotelID + "&dateIn=" + dateIn;
        $(this).attr('action', location);

    });
});

绑定功能以提交事件

3 个答案: