jquery - $.fancybox 不是函数（fancybox 弹出 ajax 响应）

Question

我想通过fancybox弹出ajax响应，在控制台看到网络部分，响应还可以。但我得到 $.fancybox 不是一个函数。提前致谢！

$("#mysubmit").click(function(){
 var myvar = {
"secure_key":"41561541561561","username":$("#username").val(),"password" :$("#password").val()};

$.ajax({

    type: "POST",
    url: "http://127.0.0.1/ajaxtest.php",
    async: false,
    data: myvar,
    success: (function (response) {
        var result =
            "<div id='result'>" +
            "<p>" + response + "</p>" +
            "</div>";
        //$.facybox is not a function HERE
        $.fancybox(result, {
            type: "html",
        }); // show formated response
      })
   })

});

Answer 1

如果有人搜索相同的问题，这里是解决方案：

$("#mysubmit").click(function(){
var myvar = {
"secure_key":"41561541561561","username":$("#username").val(),"password" :$("#password").val()};

 $.ajax({

    type: "POST",
    url: "http://127.0.0.1/ajaxtest.php",
    async: false,
    data: myvar,
    success: (function (response) {
      var result =
        "<div id='result' style='display: none;'>" +
        "<p>" + response + "</p>" +
        "<a class='btn' data-fancybox-close=''>OK!</a>"+
        "</div>";

      $("body").append(result);
    })
})

});

然后我将#result 作为data-scr 添加到标记中，效果很好。

<a data-fancybox type="Submit" id="mysubmit" class="btn" data-src="#result" >Submit </a>

Answer 2

FancyBox 必须在元素上实例化。
您实际上尝试在 jQuery 上实例化它...

尝试这个：

success: (function (response) {
  var result =
    "<div id='result'>" +
    "<p>" + response + "</p>" +
    "</div>";

  $("body").append( $(result) );

  $(document).find("#result").fancybox(); // show formated response
})