1

我已经阅读并浏览了以下所有示例：- http://fancyapps.com/fancybox/

没有什么可以帮助我制作弹出式登录框。

我检查了旧版本的 Fancybox 1.3.x，其中有一个登录框示例，但该方法在新的 Fancybox v2 上并不适用。

如果有人可以帮助我，我会很高兴。

到目前为止，我有这个代码，它是半工作的：

$("#top-login-button").click(function() {
        $.fancybox.open({
            href : "#login_form",
            padding : 0,
            onClosed : function() {
                    $("#login_error").hide();
            }
        });
    });

    $("#login_form_ajax").bind("submit", function() {

        if ($("#login_name").val().length < 1 || $("#login_pass").val().length < 1) {
            $("#login_error").show();
            return false;
        }

        $.fancybox.showActivity();

        $.ajax({
            type        : "POST",
            cache   : false,
            url     : "/login.php",
            data        : $(this).serializeArray(),
            success: function(data) {
                $.fancybox(data);
            }
        });

        return false;
    });
4

2 回答 2

7

对于 v2.x，这将起作用（请注意，我注释掉了哪些选项已更改）

$(document).ready(function() {
 $("#top-login-button").click(function() {
  $.fancybox({
   href : "#login_form",
   padding : 0,
   // it was onClosed for v1.3.4
   afterClose : function(){
    $("#login_error").hide();
   }
  }); // fancybox
 }); //click

 $("#login_form_ajax").bind("submit", function() {
  if ($("#login_name").val().length < 1 || $("#login_pass").val().length < 1) {
   $("#login_error").show();
   $.fancybox.update(); // it was $.fancybox.resize(); for v1.3.4
   return false;
  }
  $.fancybox.showLoading(); // it was $.fancybox.showActivity(); for v1.3.4
  $.ajax({
   type   : "POST",
   cache  : false,
   url    : "/login.php",
   data   : $(this).serializeArray(),
   success: function(data) {
    $.fancybox(data);
   }
  });
  return false;
 }); // bind
}); // ready

更新（2012 年 8 月 10 日）：为怀疑者添加了一个演示。

于 2012-07-02T18:56:28.377 回答
0

在您的代码中，您需要更改href : "#login_form"为href : "#login_form_ajax".

于 2014-07-17T10:58:30.863 回答