Question

我使用MagnificPopup在使用jQuery的get()方法加载东西后显示弹出窗口。 get()调用完成后，我想在下面显示弹出窗口：

<div id="tagsearch-popup" class="panel panel-default mfp-hide">
    <div class="panel-heading">Tag Search</div>
    <div class="panel-body">
        <div class="col-xs-12 no-padding">
            Example
        </div>
    </div>
</div>

这是我正在使用的jQuery。

$.get(url, function (data) {
   success: {
      $("#recalculation-guid").html(data);
      // Display popup now
   }
});

但是，当我查看MagnificPopup示例时，我只能找到将弹出窗口绑定到按钮的示例。我想以编程方式创建它。

如何在没有按钮点击的情况下使用MagnificPopup将上面的<div>转换为弹出窗口？

Answer 1

有一个名为open的方法：

$.magnificPopup.open({
  items: {
    src: 'someimage.jpg'
  },
  type: 'image'

  // You may add options here, they're exactly the same as for $.fn.magnificPopup call
  // Note that some settings that rely on click event (like disableOn or midClick) will not work here
}, 0);
 //and also close, if you're into that ;)
$.magnificPopup.close();

所以在你的代码中：

$.get(url, function (data) {
   success: {
   $("#recalculation-guid").html(data);
   // Display popup now
   $.magnificPopup.open({...});
   }
});

Answer 2

此示例可能对您有所帮助：

$("a").click(function() {
    alert("clicked");
    // your instantiation
});
$("a").click();

您需要做的是触发您实例化MagnificPopup。

的点击

没有按钮的MagnificPopup点击

2 个答案: