Question

我想显示用于表单验证的AJAX错误消息，并希望这些消息以屏幕为中心。我被建议使用模态窗口。我有以下代码，但我不知道如何做到这一点。我知道我需要在成功函数中调用模态，但不幸的是，这是关于我的JQ知识的范围。

这是我的JQ脚本，其中应该集成模态

  success: function(data){
    ...
    if(data.success == 0){
      $(div).addClass('ajax-error');
    }

这是模态代码。此代码当前设置为使用激活窗口的超链接，但我不需要。在上面的代码中出错时，应该自动调用该窗口。

  $('a[name=modal]').click(function(e) {
    e.preventDefault();

    var id = $(this).attr('href');

    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    $('#mask').css({'width':maskWidth,'height':maskHeight});

    $('#mask').fadeIn(1000);
    $('#mask').fadeTo("slow",0.8);

    var winH = $(window).height();
    var winW = $(window).width();

    $(id).css('top',  winH/2-$(id).height()/2);
    $(id).css('left', winW/2-$(id).width()/2);

    $(id).fadeIn(2000);
  });

  $('.window .close').click(function (e) {
    e.preventDefault();

    $('#mask').hide();
    $('.window').hide();
  });

  $('#mask').click(function () {
    $(this).hide();
    $('.window').hide();
  });

Answer 1

我会查看jQuery Model Dialog Plugin。

文档有点稀疏，但demo page和你的朋友Firefox和FireBug将描绘一幅非常完整的图片。

它具有您想要的AutoClose功能。

该插件应用了一个不透明的蒙版，并具有DIV样式，如“对话框标题”，“对话框标题”和“对话框关闭”，以便您设置外观样式。

如何集成模态对话框

1 个答案: