Question

在某种原因，如果我使用这个代码，它以正常方式发送表单而不是jquery？可能是什么问题呢？感谢

<script>
$(document).ready(function() {
    $("form#formi").submit(function() {
        $(":text, textarea").each(function() {
            if ($(this).val() === "") {
                $('p#error').fadeIn(1000);
                var tyhjia = true;
            }
        });
        if (tyhjia == true) {
            // tyhjia on , joten ei jatketa
        } else {
            // we want to store the values from the form input box, then send via ajax below
            var fname = $('#name').attr('value');
            var lname = $('#email').attr('value');
            $.ajax({
                type: "POST",
                url: "laheta-viesti",
                data: "name=" + fname + "& email=" + lname,
                success: function() {
                    $('form#formi').hide();
                    $('p#valmista').fadeIn(1000);
                }
            });
        }
        return false;
    });
});
</script>

Answer 1

javascript中的错误是导致此行为的常见原因。例如，您已在匿名回调中定义了tyhjia变量，并尝试在外部使用它。我试图稍微清理你的代码：

<script type="text/javascript">
    $(document).ready(function() {
        $('form#formi').submit(function() {
            var tyhjia = false;
            $(':text, textarea').each(function() {
                if($(this).val() === '') {
                    $('p#error').fadeIn(1000);
                    tyhjia = true;
                }
            });

            if (tyhjia == true) {
                // tyhjia on , joten ei jatketa
            } else {
                // we want to store the values from the form input box, then send via ajax below
                var fname = $('#name').val();
                var lname = $('#email').val();
                $.ajax({
                    type: 'POST',
                    url: 'laheta-viesti',
                    data: { name: fname, email: lname },
                    success: function() {
                        $('form#formi').hide();
                        $('p#valmista').fadeIn(1000);
                    }
                });
            }
            return false;
        });
    });
</script>

当然可能还有其他一些错误。使用FireBug或Chrome Developer Tool并检查控制台是否存在任何可能的错误报告。

通过验证的方式，这显然是你在这里尝试做的，我强烈推荐你jquery validate plugin。

Answer 2

如果您希望jquery行为完全替换默认行为，则必须明确告诉它不要执行默认行为，如下所示：

$(document).ready(function(){
            $("form#formi").submit(function(e) {
                    e.preventDefault();

注意两行代码已更改 - 您必须从函数中获取“e”这是“event”的常用缩写，然后告诉它不要执行默认行为。

jquery表单提交不起作用

2 个答案: