没有按钮点击的MagnificPopup

MagnificPopup without button click

本文关键字：MagnificPopup 按钮      更新时间：2023-09-26

我使用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> s没有按钮点击弹出?

有一个方法叫做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({...});
   }
});

这个例子可能会对您有所帮助:

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

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

相关文章：