bootstrap modal上弹出dialog 报错Maximum call stack size exceeded

昨天修改alert弹出的警告太难看了，改用dialog对话框，然后就报了一个错：

    jquery-2.0.2.min.js:5 Uncaught RangeError: Maximum call stack size exceeded. 

反复测试，在bootstrap的modal模态框上弹出了jQuery UI的dialog，才报这个错的。

堆栈溢出！！！
感觉这个问题挺严重的，怎么调试都找不到报错的原因，上网搜了一下，资料如下：
浏览器JS报错Uncaught RangeError: Maximum call stack size exceeded
JS 异常： Uncaught RangeError: Maximum call stack size exceeded

归根结底，原因是递归调用了，但是，如同第二个链接里所说的：

表面上看，是因为递归次数太多导致内存被耗费太多，但是我的程序中，并没有一处使用递归算法啊
我的js中同样是没有使用递归调用的情况啊，差点要放弃了。

问题的根源在于网页中引用了两个不同的JavaScript库，而这两个库都对JavaScript原始对象的某些方法做了修改，从而导致出现了循环引用

仔细研究了下jQuery UI 实例 - 对话框（Dialog），恍然大悟，dialog本质上也是modal。
我们这里造成报错的原因 是 我们使用的bootstrap的modal模态框和jQuery UI dialog的确定按钮的click事件冲突了，也就是说，问题的根源是引用了两个不同的JavaScript库，他们都对弹出的modal做出了修改，我两个同时嵌套使用的时候，就造成了递归调用。

最终，解决办法是将dialog的modal设置为false：

$(function() {
    $( "#dialog-modal" ).dialog({
      height: 140,
      modal: false
    });
  });

jQuery UI 实例 - 对话框（Dialog）中也说了：

模态确认
确认一个动作可能是破坏性的也可能是有意义的。设置 modal 选项为 true，并通过 buttons 选项来指定主要的和次要的用户动作。

哎。。。总之，问题解决了。