单击切换按钮时不出现弹出模式

Question

我之前曾发布过此类问题，但在进行更改后我现在收到新错误，因此我再次发布它。我有切换按钮，当我单击它时，由于无法单击任何输入表单，我的当前页面被冻结了或其他任何按钮，滚动条也会消失。

在点击切换按钮之前，一切都很好：

单击切换按钮后，错误显示如下，页面被冻结（计算机工作正常）：

我的JS和jquery页面的源代码是：

html部分是：

<!-- toggle switch -->
                <label class="switch">
                <input type="checkbox" checked="checked" value="4" />
                <div class="slider"></div>
                </label>

JS部分是：

$('.switch input[type="checkbox"]').on('change',function(){

        var checkbox=$(this);
        var checked=checkbox.prop('checked');
        var dMsg=(checked)? 'You want to activate the product':
                             'You want to deactivate the product';
        var value=checkbox.prop('value');

        bootbox.confirm({
            size: 'medium',
            title: 'Product Activation & Deactivation',
            message: dMsg,
            callback: function(confirmed){

                if(confirmed){
                    console.log(value);
                    bootbox.alert({
                        size: 'medium',
                        title: 'Information',
                        message : 'you are going to perform operation on product'+ value

                    });
                }
                else{
                    checkbox.prop('checked',!checked);
                }
            }

        });

    });

myapp.js

$(function(){

    switch(menu){

    case 'About us':
    $('#about').addClass('active');
    break;

    case 'Contact us':
        $('#contact').addClass('active');
        break;
    case 'All Products':
        $('#listProducts').addClass('active');
        break;
    case 'Manage Products':
        $('#manageProducts').addClass('active');
        break;
    default:
        if(menu == "Home") break;
        $('#listProducts').addClass('active');
        $('#a_'+menu).addClass('active');
    break;


    }

    //code for jquery datatable



    var $table=$('#productListTable');

    //execute below code only where we have this table

    if($table.length){

        var jsonUrl='';
        if(window.categoryId== ''){
            //if categoryId passed through controller is empty
            jsonUrl=window.contextRoot + '/json/data/all/products';
        }
        else{
            //if categoryId passed is there listed in listProducts.jsp
            jsonUrl=window.contextRoot + '/json/data/category/'+ window.categoryId +'/products';
        }

        $table.DataTable({
            lengthMenu:[[3,5,10,-1],['3 Records','5 Records','10 Records','ALL']],
            pageLength:5,
            ajax :{
                url: jsonUrl,
                dataSrc : ''
                    },
            columns: [
                {
                    data : 'code' ,
                    mRender:  function(data,type,row){

                        return '<img src="'+window.contextRoot+'/resources/images/'+data+'.jpg" class="dataTableImg" />';
                    }
                },
                {
                    data : 'name' 
                },
                {
                    data : 'brand' 
                },
                {
                    data : 'unitPrice' ,
                    mRender:function(data,type,row){
                        //to make Rs. in unit price
                        return '&#8377; ' + data
                    }
                },
                {
                    data : 'quantity' ,
                    mRender:function(data,type,row){
                        if(data<1){
                            return '<span style="color:red">Out of Stock!</span>';
                        }
                        return data;
                    }
                },{
                    data : 'id',
                    mRender: function(data,type,row){
                        //data means id 
                        var str='';
                        str += '<a href="'+window.contextRoot+ '/show/'+data+'/product" class="btn btn-danger">View</a>';

                        if(row.quantity<1){
                            str+='<a href="javascript:void(0)" class="btn btn-success disabled">Add to Cart</a>';
                        }
                        else{
                            str += '<a href="'+window.contextRoot+ '/cart/add/'+data+'/product" class="btn btn-success">Add to Cart</a>';
                        }


                        return str;
                    }
                }

            ]
        });
    }

    //dismissing alert after 3sec
    var $alert=$('.alert');

    if($alert.length){
        setTimeout(function(){
            $alert.fadeOut('slow');
        },3000)
    }

    //-------------------------------
    $('.switch input[type="checkbox"]').on('change', function() {

          var checkbox = $(this);
          var checked = checkbox.prop('checked');
          var dMsg = (checked) ? 'You want to activate the product' :
            'You want to deactivate the product';
          var value = checkbox.prop('value');

          bootbox.confirm({
            size: 'medium',
            title: 'Product Activation & Deactivation',
            message: dMsg,
            callback: function(confirmed) {

              if (confirmed) {
                console.log(value);
                bootbox.alert({
                  size: 'medium',
                  title: 'Information',
                  message: 'you are going to perform operation on product' + value

                });
              } else {
                checkbox.prop('checked', !checked);
              }
            }

          });

        });





});