IE8 e.preventDefault() 只工作一次（ajax 提交后忽略）答案

【问题标题】：IE8 e.preventDefault() only works once (ignored after ajax submission)IE8 e.preventDefault() 只工作一次（ajax 提交后忽略）
【发布时间】：2012-11-21 08:17:15
【问题描述】：

我在 jquery form plugin 的帮助下使用 AJAX 提交表单。除了e.preventDefault() 只能在 IE8 中使用一次，它的效果很好。第二次提交后，页面重定向到表单的url。

我很确定我需要做某种事件委托，但我不完全确定如何去做。

上下文是一个 wordpress 网站。以下脚本出现在注册表单 HTML 之前。

    <script type="text/javascript">

    jQuery.fn.outerHTML = function(s) {
    return (s)
      ? this.before(s).remove()
      : jQuery("<p>").append(this.eq(0).clone()).html();
    }

    jQuery(document).ready(function($){

        $("form input").removeAttr('tabindex');

        ajaxregister = function(e) {
            //e = e || window.event;
            e.preventDefault();
            $(this).animate({opacity:0}, 500);
            $(this).siblings("#loading").fadeIn();
            $(this).ajaxSubmit({
                //cache : false,
                //url:'http://streetofwalls.dev/wp-login.php?action=register'
                success: function( data ) {
                    //console.log(data);

                    var $message = $(data).find('.message').outerHTML();
                    var $error = $(data).find('#login_error').outerHTML();
                    var $form = $(data).find('#registerform').outerHTML();
                    //console.log( 'success' );

                    //$(e.target).html( ( ($error) ? $error : $message ) + $form ).fadeTo(500,1);
                    var target_id = $(e.target).attr("id");
                    $("#"+target_id).html( ( ($error) ? $error : $message ) + $form ).animate({opacity:1}, 500);
                    $("#"+target_id).siblings("#loading").css('display', 'none');

                }
            });
        return false;
        }

        $(".widget_reg_widg #registerform").submit( ajaxregister ); //should this be .delegate() ???


    });
    </script>

【问题讨论】：

包含以下内容可能会有所帮助：这只是直接的 HTML 吗？它是像 ASP.NET Web Forms 这样的框架，与您的表单事件有关吗？另外，我还没有尝试过，但是你能在 jsfiddle 中得到这个 repro 吗？
我更新了问题。它是直接的 HTML。
我看到您使用的是 jquery 的 delegate() 函数，但使用的是 jquery 表单插件。浏览示例，看起来表单插件使用“$(selector).ajaxForm(argsObject)”来绑定事件。也许您应该使用表单方法而不是原始 jquery API。您尝试过吗？
@aikeru 我应该澄清一下，我目前正在将 .submit() 用于生产版本。 .delegate() 的变化是我试图解决这个问题的尝试。我将修改问题，以便更清楚。
我想我发现了一个问题。您没有从 ajaxregister = function(e) { ... } 函数返回 false 。请尝试一下。 preventDefault 似乎是多余的，但文档特别说“总是返回 false”

标签： jquery internet-explorer-8 cross-browser jquery-events

【解决方案1】：

我通过在成功回调函数的末尾添加以下几行来解决这个问题。 Wordpress 检测到 IE 并将“ie8” id 添加到 html 标记。您也可以使用 jquery 或 modernizr 轻松检查 ie。

if ( $('html').attr('id') == "ie8" ) {
    $(".widget_reg_widg #registerform").delegate( this, "submit", ajaxregister );
}

【讨论】：