Question

我想用引导模式窗口替换当前的dhtmlx模态窗口。我的应用程序当前使用容器来存储dthmlx模态窗口的实例并使用它。

myContainer = new dhtmlXWindows();

我想用bootstrap做同样的事情但是我似乎无法打开一个bootstrap模式实例，即使在JSFiddle中也是如此。

我发现an exemple of what I want to do看起来像这样：

var dialogInstance = new BootstrapDialog({
   title: 'Dialog instance',
   message: 'Hi Apple!'
 });
 dialogInstance.open();

但是这段代码在the JSFiddle I created to test it中没有任何作用。

您对如何解决我的问题有所了解吗？我不想使用HTML代码来创建对话框，我需要在JS中使用它，就像我的小提琴一样。

非常感谢。

Answer 1

// Using init options
        var dialogInstance1 = new BootstrapDialog({
            title: 'Dialog instance 1',
            message: 'Hi Apple!'
        });
        dialogInstance1.open();
        
        // Construct by using setters
        var dialogInstance2 = new BootstrapDialog();
        dialogInstance2.setTitle('Dialog instance 2');
        dialogInstance2.setMessage('Hi Orange!');
        dialogInstance2.setType(BootstrapDialog.TYPE_SUCCESS);
        dialogInstance2.open();
        
        // Using chain callings
        var dialogInstance3 = new BootstrapDialog()
            .setTitle('Dialog instance 3')
            .setMessage('Hi Everybody!')
            .setType(BootstrapDialog.TYPE_INFO)
            .open();

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script> 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.5/css/bootstrap-dialog.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.5/js/bootstrap-dialog.min.js"></script>

参考：http://www.jqueryscript.net/demo/jQuery-Modal-Dialog-Plugin-For-Bootstrap-3-Bootstrap-3-Dialog/examples/

参考：http://www.jqueryscript.net/lightbox/jQuery-Modal-Dialog-Plugin-For-Bootstrap-3-Bootstrap-3-Dialog.html

创建并打开引导模式窗口

1 个答案: