在jquery中选中复选框时启用confirmbox按钮


Enable buttons of confirmbox when checkbox checked in jquery

这是functions.php文件中的代码。有一个用于输入值的确认框。当我按下"确定"按钮时,值会被保存。但我希望用户先选中复选框,然后再输入值。这就是我所做的一切,但问题在于,当我在不选中复选框的情况下按下"确定"按钮时,警报会出现,同时确认框会隐藏。我希望确认框在警报消失后保持其位置。

var mess ="abc";
jQuery.confirm({
                'title'     : '<?php _e('Terms','Theme'); ?>',
                'message'   :  mess ,
                'buttons'   : {
                    '<?php _e('OK','Theme'); ?>'    : {
                        'class' : 'button1',
                        'action': function()
                        {
                            if(jQuery('#check').is(":checked")){
                                post_ok = 1; 
                                jQuery("#my_form_"+id).submit();
                                return true;
                            }
                            else{
                                alert("select terms and conditions first.");
                            }
                        }
                    },
                    '<?php _e('No','Theme'); ?>'    : {
                        'class' : 'button2',
                        'action': function(){ return false; }   
                    }
                }
            });

confirm.js

(function($){
$.confirm = function(params){
    if($('#confirmOverlay').length){
        // A confirm is already shown on the page:
        return false;
    }
    var buttonHTML = '';
    $.each(params.buttons,function(name,obj){
        // Generating the markup for the buttons:
        buttonHTML += '<a href="#" class="button '+obj['class']+'">'+name+'<span></span></a>';
        if(!obj.action){
            obj.action = function(){};
        }
    });
    var markup = [
        '<div id="confirmOverlay">',
        '<div id="confirmBox">',
        '<h1>',params.title,'</h1>',
        '<p>',params.message,'</p>',
        '<div id="confirmButtons">',
        buttonHTML,
        '</div></div></div>'
    ].join('');
    $(markup).hide().appendTo('body').fadeIn();
    var buttons = $('#confirmBox .button'),
        i = 0;
    $.each(params.buttons,function(name,obj){
        buttons.eq(i++).click(function(){
            // Calling the action attribute when a
            // click occurs, and hiding the confirm.
            obj.action();
            $.confirm.hide();
            return false;
        });
    });
}
$.confirm.hide = function(){
    $('#confirmOverlay').fadeOut(function(){
        $(this).remove();
    });
}
})(jQuery);

此问题已解决。我为button1分配了一个ID并应用属性(已禁用)。

var agree_button = document.getElementById('agree_button');
jQuery.confirm({
                'title'     : '<?php _e('Terms','Theme'); ?>',
                'message'   :  mess ,
                'buttons'   : {
                    '<?php _e('OK','Theme'); ?>'    : {
                        'class' : 'button1',
                        'id' : 'agree_button',
                        'action': function()
                        {
                            if(jQuery('#check').is(":checked")){
                                my_post_ok = 1; 
                                jQuery("#my_form_"+id).submit();
                                return true;
                            }
                            else{
                                alert("select terms and conditions first.");
                                agree_button.disabled = false;
                            }
                        }
                    },
                    '<?php _e('No','Theme'); ?>'    : {
                        'class' : 'button2',
                        'action': function(){ return false; }   
                    }
                }
            });