Question

我想做的是以下内容。我有一张图片显示悬停时的工具提示。当字段未通过验证时，我想在新段落中显示默认错误消息以及图像标题。然后应隐藏工具提示图像。当该字段然后通过验证时，应再次隐藏默认错误消息（默认行为），应隐藏我的段落并再次显示工具提示图像。

因此，当字段未通过验证时：
- 默认验证错误消息
- 工具提示图像的标题

当一个字段确实通过验证时：
- 工具提示图像

我得到了“失败的验证”部分，但当字段通过验证时，工具提示图像的标题仍然显示，工具提示图像被隐藏。所以我基本上需要的是当一些字段通过验证时回调函数。

这是我到目前为止所得到的：

$(document).ready(function(){

$('form#saveform').validate({

    ignore: ":hidden",
    errorPlacement: function (error, element) {

        var error_td = element.parent('td').next('td');
        var tooltip_img = error_td.find('img.tooltip');

        error_td.append(error);
        error_td.append('<p class="notice">' + tooltip_img.attr('oldtitle') + '</p>');

        tooltip_img.hide();

    }

});

});

任何人都可以帮助我完成这项工作吗？

Answer 1

我不认为验证插件在验证成功时会有回调。虽然它有回调来应用和删除元素的错误突出显示。所以你能做的是：

$('form#saveform').validate({
  highlight: function(element, errorClass, validClass) {
    // add error, hide image
  },
  unhighlight: function(element, errorClass, validClass) {
     // remove error, show image
  }
});

Answer 2

啊 - 你想要success钩子：

$(document).ready(function(){

    $('form#saveform').validate({

        ignore: ":hidden",
        errorPlacement: function (error, element) {

            var error_td = element.parent('td').next('td');
            var tooltip_img = error_td.find('img.tooltip');
            error_td.append(error);
            error_td.append('<p class="notice">' + tooltip_img.attr('oldtitle') + '</p>');
            tooltip_img.hide();

        }
        success: function() {
            // Your success code here...
        }

    });

});

jQuery验证：显示/隐藏除默认元素之外的自定义元素

2 个答案: