联系表单和 IE8 问题 - 似乎无法停止表单提交答案

【问题标题】：Contact form & IE8 woes - can't seem to stop the form submitting联系表单和 IE8 问题 - 似乎无法停止表单提交
【发布时间】：2012-06-01 05:17:57
【问题描述】：

我有一个使用 jQuery 中的.ajax() 方法提交的联系表单，以便在不刷新页面的情况下提交表单。它适用于除 IE 之外的所有浏览器，它非常适合并坚持刷新页面。

这是我的代码：

function appointmentform() {    
    $("#appointment-form").on("submit", function(e) {

        // serialize all input data
        var dataString = $(this).serialize();
        console.log(dataString);

        // if there are no inputs with errors
        if ($("input.required.error").length < 1) {

            // ajax call to mail.php script
            $.ajax({
                type: "POST",
                url: "http://www.thesalonleamingtonspa.com/mail",
                data: dataString,
                success: function() {
                    // success notice
                }
            });

        }

        // cancel form submit
        if (e.preventDefault) { 
            e.preventDefault(); 
        } else { 
            e.returnValue = false; 
        }
    });
}

我意识到e.preventDefault() 对 IE 没有任何意义，但我认为e.returnValue = false 是等价的。有人知道为什么它不适合我吗？

编辑：问题子在于 IE8。

【问题讨论】：

我会写像<form ... onsubmit="return false"></form>这样的表单标签
在 IE 8 中使用 jQuery 的 preventDefault() 从来没有遇到过任何问题。
@inhan，他在使用 jQuery，所以内联 JavaScript 是丑陋且不必要的。

标签： javascript jquery forms return-value preventdefault

【解决方案1】：

真正的罪魁祸首是 IE8 & console.log

IE8 不支持直接写入console，因此一旦遇到console 函数，脚本就会停止运行。在我的代码中，preventDefault 出现在 console 部分之后，因此它没有运行。

解决方案：在 IE8 中保持开发者工具打开将允许您写信至console

我正在回答我自己的问题，因为其他答案都不是 100% 正确的，尽管它们很有帮助。任何将来查看我的问题的人都可能会从我现在概述的真正原因中受益。

【讨论】：

【解决方案2】：

这个怎么样：不用提交，只用一个按钮：

// use this ~ buttons don't do anything unless explicitly told to
<input type="button">

// not this ~ the default behavior is to submit ~ which you don't want
<input type="submit">

你只需要监听按钮的点击，然后触发函数。

我已经好几年没有使用提交按钮了……实际上……只是为了避免这个问题。

我通常监听“提交”事件的方式是点击。以我的经验，即使是 IE 也可以处理点击事件。

function doAjaxStuff {
    // do form validation
    // do ajax stuff
}
myButton.click(doAjaxStuff);

【讨论】：

不错，这实际上是个好主意。这停止了刷新，但联系表单仍然没有从 IE8 成功发送。似乎在console.log 处导致错误。该错误是否会阻止在console 之后编写的代码不执行？

【解决方案3】：

我意识到 e.preventDefault() 对 IE 没有任何意义

仅当您不使用 jQuery 时才如此。 jQuery 使这个跨浏览器。

猜猜：你用jQuery

JavaScript 提交事件不会在 Internet Explorer 中冒泡。但是，从 jQuery 1.4 开始，依赖事件委托和 submit 事件的脚本将在浏览器中始终如一地工作，这已经规范了事件的行为。

-- http://api.jquery.com/submit/

【讨论】：

我完全同意这一点，但这并不是他问题的真正答案，应该作为评论发布。
@muppethead...您已经提到过两次...确切的错误信息是什么？
@muppethead，它只是意味着第 205 行是问题所在，但那里也应该有一条错误消息。第 205 行到底是什么？
@muppethead，那么当您删除第 205 行时会发生什么？也许是一些看不见的字符弄乱了那条线。
@muppethead，console.log 和 IE 8，AFAIK 没有问题......也许你在这些线上有流浪的隐形（从网上复制和粘贴？）。也许数据超出了一些长度限制。试试看。

【解决方案4】：

返回false 应该取消表单提交

代替

    if (e.preventDefault) { 
        e.preventDefault(); 
    } else { 
        e.returnValue = false; 
    }

使用

return false;

【讨论】：

这并不能解决问题。还有其他想法吗？