如何避免JQuery弹出窗口覆盖整个屏幕宽度?

如何避免JQuery弹出窗口覆盖整个屏幕宽度?,jquery,popupwindow,Jquery,Popupwindow,我正在尝试使用插件插入JQuery弹出窗口。虽然,它的工作很好,但只要弹出窗口显示出来,它就会覆盖整个屏幕宽度。高度可以,但宽度可以覆盖整个屏幕。 我尝试使用插件文档中给出的width属性,但同样的方法不起作用,而属性的其余部分按预期工作 下面是示例代码 function shw(){ $.confirm({ boxWidth: '30%', animation: 'Rotate', title: 'Prompt!'

我正在尝试使用插件插入JQuery弹出窗口。虽然,它的工作很好,但只要弹出窗口显示出来,它就会覆盖整个屏幕宽度。高度可以,但宽度可以覆盖整个屏幕。 我尝试使用插件文档中给出的width属性,但同样的方法不起作用,而属性的其余部分按预期工作

下面是示例代码

   function shw(){
        $.confirm({
            boxWidth: '30%',
            animation: 'Rotate', 
    title: 'Prompt!',
    content: '' +
    '<form action="" class="formName">' +
    '<div class="form-group">' +
    '<label>Enter something here</label>' +
    '<input type="text" placeholder="Your name" class="name form-control" required />' +
    '</div>' +
    '</form>',
    buttons: {
        formSubmit: {
            text: 'Submit',
            btnClass: 'btn-blue',
            action: function () {
                var name = this.$content.find('.name').val();
                if(!name){
                    $.alert('provide a valid name');
                    return false;
                }
                $.alert('Your name is ' + name);
            }
        },
        cancel: function () {
            //close
        },
    },
    onContentReady: function () {
        // bind to events
        var jc = this;
        this.$content.find('form').on('submit', function (e) {
            // if the user submits the form by pressing enter in the field.
            e.preventDefault();
            jc.$$formSubmit.trigger('click'); // reference the button and click it
        });
    }
});

        }
函数shw(){
美元。确认({
箱宽:“30%”,
动画:“旋转”,
标题:“提示!”,
内容:“”+
'' +
'' +
“在此处输入内容”+
'' +
'' +
'',
按钮:{
表格提交:{
文本:“提交”,
btn类:“btn蓝色”,
行动:功能(){
var name=this.$content.find('.name').val();
如果(!name){
$.alert('提供有效名称');
返回false;
}
$.alert('您的名字是'+名字);
}
},
取消:函数(){
//接近
},
},
onContentry:函数(){
//绑定到事件
var jc=这个;
此.$content.find('form')。关于('submit',函数(e){
//如果用户通过在字段中按enter键提交表单。
e、 预防默认值();
jc.$$formSubmit.trigger('click');//引用按钮并单击它
});
}
});
}

这里,对按钮单击事件调用方法shw()

根据
jquery confirm
插件()的文档,要设置
customWidth
选项,您还必须设置
useBootstrap:false

请编辑您的问题以包含您的代码。请参阅。编辑问题并添加代码。根据插件文档,属性“boxwidth”用于设置弹出框的大小。在这里它不起作用。是的,它需要任何浏览器更改或类似的更改吗?文档中说“useBootstrap必须设置为false才能使用此功能”(
boxWidth
)-您这样做了吗?我添加了这个作为答案。