Jquery联系人表单提交后隐藏


Jquery contact form hiding after submit

我有一个联系人表单,它在加载页面时被隐藏。然后可以通过单击联系人表单按钮来查看联系人表单,使其向上滑动和向下滑动。问题是,当提交表单时,页面会刷新,如果有错误消息或成功消息,则由于页面已重新加载而被隐藏,您必须单击"联系表单"按钮才能看到它。我不擅长jquery或php。任何帮助都将不胜感激。表单提交后,我需要显示消息。

该网站http://www.carlisleironing.co.uk/index.php

我的jquery是

$(document).ready(function () {
    $("#contactLink").click(function () {
        if ($("#contactForm").is(":hidden")) {
            $("#contactForm").slideDown("slow");
        } else {
            $("#contactForm").slideUp("slow");
        }
    });
});

添加以下内容(就在问题的最后一个});之前):

if ($('#contactForm #error').size() > 0){
    $('#contactForm').slideUp('slow'); // or just .show();
}

测试#error元素是否存在,如果存在,则显示表单。我不确定您的成功消息是什么样子的,但类似的测试也可以用于此。

至于其他答案:是的,你可以进行AJAX提交,但很可能(我在这里假设上下文)这超出了这个问题的范围。这将涉及特殊的请求处理和添加额外的验证库。

您可以使用ajax提交表单并显示结果,而无需重新加载页面:

$('form').submit(function() {
    $.post($(this).attr('action'), $(this).serialize(), function(data) {
        console.log(data);
    });
    return false;
});

我假设当有人提交表单时,php页面会生成错误,但用户无法看到这些错误,因为表单在页面加载时默认是隐藏的。

您可以命名提交按钮。如果用户单击提交按钮,则该按钮的值将随get或post请求一起发送。然后,如果表单已提交,您可以更改php页面的行为,使其不隐藏联系人表单。

<input type="submit" name="theSubmitButton" value="Submit!" />

在php中,如果用户提交了表单,则会设置$_GET['theSubmitButton'](如果您使用的是POST请求,则为$_POST),如果不是这样,则不会设置。您可以使用isset( $_GET['theSubmitButton'] )来测试用户是否提交了页面,并相应地更改联系人表单的类。