Bootbox未显示弹出模式 [英] Bootbox not is not showing pop up modal

问题描述

我已经在项目中下载了bootbox.js并实现了此代码以显示弹出的模态对话框，但控制台上未打印任何错误或成功结果.我对产生错误的位置感到困惑.

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);
                }
            }

        });

    });

html文件

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

解决方案

您使用了错误的选择器.您将标记而不是类用于开关". 您需要使用

$('.switch input[type="checkbox"]')

相反.

参考 https://api.jquery.com/category/selectors/

此外，请确保已添加依赖项-jquery和bootstrap. 工作版本- http://jsfiddle.net/grrakesh4769/85etyhfc/3/

I have downloaded bootbox.js in my project and implemented this code to show the pop up modal dialog but nothing errors or success result is printed in my console.I am getting confusing where the error is generated.

Js file

$('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);
                }
            }

        });

    });

html file

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

解决方案

You have used the wrong selector. You used tag instead of class for 'switch'. You need to use

$('.switch input[type="checkbox"]')

instead.

Ref. https://api.jquery.com/category/selectors/

Also, make sure you have added the dependencies - jquery and bootstrap. Working version - http://jsfiddle.net/grrakesh4769/85etyhfc/3/

这篇关于Bootbox未显示弹出模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！