如何关闭模型弹出窗口jquery

how can i close the Model popup window jquery

本文关键字：窗口 jquery 何关闭 模型      更新时间：2023-09-26

我的视图页面上有一个按钮，每当点击它时，就会出现一个弹出模式。。。现在我想关闭那个模态。。。

这是我的代码

function openSirenModal() {
var timeout;
var progress;
var status;
$.modal({
    contentAlign: 'center',
    width: 240,
    title: 'Loading',
    content: '<div style="line-height: 25px; padding: 0 0 10px"><span id="modal-status">Contacting to the device...</span><br><span id="modal-progress">0%</span></div>',
    buttons: {},
    scrolling: false,
    actions: {
        'Cancel': {
            color: 'red',
            click: function (win) {
                win.closeModal();
            }
        }
    },
    onOpen: function () {
        // Progress bar
        var progress = $('#modal-progress').progress(100, {
            size: 200,
            style: 'large',
            barClasses: ['anthracite-gradient', 'glossy'],
            stripes: true,
            darkStripes: false,
            showValue: false
        }),
            // Loading state
            loaded = 0,
            // Window
            win = $(this),
            // Status text
            status = $('#modal-status'),
            // Function to simulate loading
            simulateLoading = function () {


            };
        // Start
        //timeout = setTimeout(simulateLoading, 2500);
    },

    onClose: function () {
        // Stop simulated loading if needed
        clearTimeout(timeout);
    }

});
var siren = "siren";
$.ajax({
    type: "POST",
    data: {
        value: siren
    },
    url: "http://localhost/siren/siren/",
    success: function (data) {
        alert(data);
        if (data == 1) {
            var auto_refresh = setInterval(
                function () {
                    $.get('siren/sirenjson', function (datas) {
                        if (datas == 1) {
                            $('#modal-progress').hideProgressStripes().changeProgressBarColor('green-gradient');
                            $('#modal-status').text('success!');
                            setTimeout(function () {
                                clearInterval(auto_refresh);
                                win.closeModal();//here i want to close the popup modal
                            }, 1500);

                        }
                    });
                }, 1000);


        } else {
        }
        //clearTimeout(timeout);
    },
    error: function () {
        alert("error");
        progress.hideProgressStripes().changeProgressBarColor('red-gradient');
        setTimeout(function () {
            win.closeModal();
        }, 1500);
        status.text('error!');
    }
});
 };

我已经写了代码win.closeModal（）；但它不起作用，因为我无法访问setInterval中的win变量。。我不知道如何访问它

<div id="modal">Modal text <br /><button type='button' class='close'>CLOSE</button></div>
$('.close').on('click', function(){ 
         $.modal.close();
         $('#modal, #open_modal').toggle();
    });

如果您可以跳过closeModal(); ，请尝试此操作

JSFIDDLE试验

相关文章：