Question

我有一个简单的单页网站。在那里，我有15个相同的联系表单，具有相同的ID构建和简单的PHP。我的麻烦：AJAX只能使用第一个ID。所有其他表单打开白页“谢谢”。我的代码：

$(function () {

    $('#contact-form').validator();

    $('#contact-form').on('submit', function (e) {
        if (!e.isDefaultPrevented()) {
            var url = "contact.php";

            $.ajax({
                type: "POST",
                url: url,
                data: $(this).serialize(),
                success: function (data)
                {
                    var messageAlert = 'alert-' + data.type;
                    var messageText = data.message;

                    var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>';
                    if (messageAlert && messageText) {
                        $('#contact-form').find('.messages').html(alertBox);
                        $('#contact-form')[0].reset();
                    }
                }
            });
            return false;
        }
    })
});

我只有一个解决方案 - 为所有联系表单创建不同的ID，然后在JS中手动定位它们。但我认为这段代码不是很好的做法，也没有优化。请帮助覆盖此代码。我很感激为此提供任何帮助。

Answer 1

页面上的ID必须是唯一的。这就是它无法正常工作的原因。

对多个元素使用相同的ID并不是一个好习惯。所有元素都可以共享类名。

多个AJAX联系表单。如何在一个页面上覆盖多个表单的此代码

1 个答案: