Question

我正在使用带有magnificPopUp的AJAX弹出窗口。我想在jQuery点击事件中打开这个弹出窗口，但我现在不知道怎么做。

$('.popup').click(function() {
    var id = $(this).attr('rel');
    url = '/test-ajax.php?id=' + id;
    alert("url" + url); //this shows the URL where the popUp should load
})

“正常”的大型PopUp Class看起来如此：

$('.simple-ajax-popup-align-top').magnificPopup({
    type: 'ajax',
    alignTop: true,
    overflowY: 'scroll' 
});

感谢您的帮助。

Answer 1

假设你的ajax调用产生了HTML字符串，你可以尝试这样的事情：

$('.popup').click(function() {
    var id = $(this).attr('rel');
    url = '/test-ajax.php?id=' + id;

    $.ajax({
        type: "POST",
        url: url,
        success: function(result) {
            $('.simple-ajax-popup-align-top').magnificPopup({
                alignTop: true,
                overflowY: 'scroll',
                items: {
                    src: result,
                    type: 'inline'
                }
            }).magnificPopup('open');
        },
    });
});

代码的作用基本上是触发ajax调用（记录为here）。在ajax成功回调中，它触发magnificpopup，通过“items”属性（记录为here和here将结果（这是从ajax调用获得的HTML字符串）插入到magnificpopup中 - 请参阅本节正上方的“公共财产”）

使用jQuery打开magnificPopup Ajax popUp

1 个答案: