动态设置属性叠加 - CustomBox

时间:2018-02-24 19:24:31

标签: javascript jquery jquery-plugins javascript-objects

我正在使用Custombox作为模态。我有一个按钮,当它被点击时,模态是打开的:

    var regModal = new Custombox.modal({
    content: {
        effect: 'fadein',
        target: '#reg',
        container: "#target",
    },
    overlay:{
        close: true
    }

});

$('#regBtn').click(function(e){
    e.preventDefault();
    regModal.open();
});

这个模态有另一个按钮。我希望单击此按钮以防止或不覆盖点击时关闭模式。这个属性是:

regModal.options.overlay.close

问题在于,当我将其设置为false(覆盖点击时没有关闭模式)时,如下所示:

regModal.options.overlay.close = false

,它不适用于当前模态,但在关闭当前模式后应用于下一模态。 有没有办法动态更改overlay.close属性?

2 个答案:

答案 0 :(得分:0)

你试过这个:

$('#regOtherBtn').click(function(e){
    e.stopPropagation();
    regModal.options.overlay.close = false
});

答案 1 :(得分:0)

解决方案是将click事件绑定到覆盖自定义逻辑以关闭模式:

var regModal = new Custombox.modal({
    content: {
        effect: 'fadein',
        target: '#reg',
        container: "#target",
    },
    overlay:{
        close: false // Do not close on overlay click
    }

});
var closeOnClick = false;
$('#modalBtn').click(function(e){
    closeOnClick = true;
});
// Bind a click event to overlay
$('body').on('click', '.custombox-content', function (e) {
    // If overlay is clicked and closeOnClick is true. close the modal
    if($(e.target).hasClass('custombox-content') && closeOnClick ){
        Custombox.modal.close();
    }
});