Bootstrap jQuery ui 对话冲突

Question

我试图在我的 bootstrap 网站上添加一个简单的对话框，但我做对了。我的链接似乎出了点问题，因为当我在一个空白网站（没有 Bootstrap 链接）上测试对话框时，它运行良好。请看看我的代码...

请尽量简单：

<!doctype html>
<html lang="en">
    <head>
    <meta charset="utf-8">
    <title>jQuery UI Dialog - Default functionality</title>

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
    <link rel="stylesheet" type="text/css" href="jquery-style.css">
    <link rel="stylesheet" href="/resources/demos/style.css">

    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
      <script>
      $(function() {
        $( "#dialog" ).dialog({
        modal:true,
        show: {effect:"fade",
        duration:250},
        hide: {effect:"fade",
        duration:250}
        });
      });
      </script>
    </head>
    <body>
    </body>
</html>

Answer 1

Stefanos Ioannou，您使用的是 2 jquery 版本，为什么不放置最新版本。

或使用jQuery.noConflict();准备好文档，这可能会解决您的问题。

Bootstrap jQuery ui 对话冲突

Bootstrap jQuery ui dialog conflict

html

javascript

jquery

dialog

twitter-bootstrap