1

我有一个包含多个输入字段的公式的站点。在所有这些输入字段中，我都有包含一些描述的占位符属性。但是我们都知道占位符属性在 IE 中不起作用，所以我也使用 jQuery Placeholder Enhanced 来使占位符在 IE 中显示。这行得通。

但同时我正在使用 jQuery validate 来验证我的表单。当我按下提交按钮并且验证失败时，所有占位符在 IE 中都消失了。

我的验证如下所示：

$(".myForm").validate({
    submitHandler: function (form) {
        $.post("/handlers/CustomHandler.ashx", $(".myForm").serialize(),
            function (data) {
                if (data.result.type == "message") {
                    $(".myForm").parent().html(data.result.data);
                }
                else if (data.result.type == "redirect") {
                    location.href = data.result.data;
                }
            }
        );
     }
});

我尝试使用 invalidHandler 选项并再次触发 placeholderEnhanced() 函数，如下所示：

$(".myForm").validate({
    submitHandler: function (form) {
        $.post("/handlers/CustomHandler.ashx", $(".myForm").serialize(),
            function (data) {
                if (data.result.type == "message") {
                    $(".myForm").parent().html(data.result.data);
                }
                else if (data.result.type == "redirect") {
                    location.href = data.result.data;
                }
            }
        );
     },
     invalidHandler: function () {
        if (!Modernizr.input.placeholder) {
            $('input[placeholder], textarea[placeholder]').placeholderEnhanced();
        }
     }
});

但不幸的是，它不起作用。如果我复制粘贴这一行：

$('input[placeholder], textarea[placeholder]').placeholderEnhanced();

进入我的 IE 控制台并在验证发现一些错误后触发它，占位符再次显示。我也尝试过发出警报（“表单中有错误”）；在 if 语句中，当按下表单中的提交按钮时会显示。

任何人都有一些线索来说明可能出了什么问题，以及在按下提交按钮并且验证无效后如何使占位符在 IE 中不消失。

提前致谢！

/金

4

1 回答 1

0

问题可能出在 jquery.placeholder.js 中的这段代码中：

    // Blank on submit -- prevents submitting with unintended value
    this.form && $( this.form ).submit( function() {
      // $input.trigger( 'focus' ); would be problematic
      // because it actually focuses $input, leading
      // to nasty behavior in mobile browsers
      if ( $input.hasClass('placeholder') ) {
        $input
       .val( '' )
        .removeClass( 'placeholder' );
       }
    });

在触发 jquery.validate 的 validate 方法后，jquery 会将提交处理传递给此代码。我注释掉了这段代码，占位符在 IE 中停止消失。我在服务器端检查占位符填充的字段。但是如果你想在提交之前清空这些值，你应该以某种方式阻止调用这个方法以防提交错误。如果我弄清楚确切的位置，我会在这里写一个评论。

于 2012-08-14T14:59:38.877 回答