Question

我已尝试过所有CDN但总是出错。请建议正确的CDN

＆＃13;

jQuery(document).ready(function() {
  debugger;
  jQuery(function() {
    jQuery("#divLookUp").dialog({
      autoOpen: false,
      minWidth: 600,
      show: {
        effect: "clip",
        duration: 200
      },
      hide: {
        effect: "clip",
        duration: 200
      }

    });
  });
});

＆＃13;

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.form/4.2.1/jquery.form.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />

＆＃13;

未捕获的TypeError：jQuery（...）。对话框不是函数

Answer 1

在你的html文件中添加：

<script type="text/javascript" src="//code.jquery.com/ui/1.11.1/jquery-ui.js">
</script>

Answer 2

在第一行，您只是导入jQueryUI css而不是JavaScript库。您需要添加jQueryUI js依赖项和jQuery js依赖项（请注意 https 源代码）。

<script src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />

<button id="openDialogBtn">Click to open the dialog</button>
<div id="dialog" title="I'm the dialog title" hidden="hidden">I'm the dialog body</div>

<script>
$("#dialog").dialog({
    autoOpen: false,
    minWidth: 600,
    show: {
        effect: "clip",
        duration: 200
    },
    hide: {
        effect: "clip",
        duration: 200
    }
});

$("#openDialogBtn").click(function() {
    $("#dialog").dialog("open");
});
</script>

Answer 3

jQuery(...).dialog is not a function对给定代码的唯一解释是浏览器阻止加载http://code.jquery.com/ui/1.11.1/jquery-ui.min.js，这可能是因为您在https网站上测试了给定代码，或者可能是因为您已启用脚本拦截器。

如果您在https上测试了代码，则会阻止以http:开头的所有脚本的加载。如果您将代码加载更改为：

jQuery(document).ready(function() {
  debugger;
  jQuery(function() {
    jQuery("#divLookUp").dialog({
      autoOpen: false,
      minWidth: 600,
      show: {
        effect: "clip",
        duration: 200
      },
      hide: {
        effect: "clip",
        duration: 200
      }

    });
  });
});

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.form/4.2.1/jquery.form.min.js" type="text/javascript"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />

错误不再存在。但是你仍然遇到加载多个jQuery和jQuery UI版本的问题。

如果问题仍然存在，那么您的浏览器或其他东西会阻止加载jquery ui。

Answer 4

代替关注

        var box = $("#wait").dialog({
            autoOpen: false,
            //height: 150,
            //weight: 50,
            resizable: false,
            modal: true
        }).parent().find('.ui-dialog-titlebar').hide();
        $(document).ajaxStart(function(){
            $("#wait").dialog('open');
        });
        $(document).ajaxComplete(function(){
            $("#wait").dialog('close');    
        });

我用下面的代码。有效。

$（function（）{

        var box = $("#wait").dialog({
            autoOpen: false,
            //height: 150,
            //weight: 50,
            resizable: false,
            modal: true
        }).parent().find('.ui-dialog-titlebar').hide();
        $(document).ajaxStart(function(){
            $('#wait').load(this.href, function () {
                $(this).dialog('open');
            });
            return false;  
        });
        $(document).ajaxComplete(function(){
            $('#wait').load(this.href, function () {
                $(this).dialog('close');
            });
            return false;
        });
    });

尝试此代码，该代码已在我的设置中经过测试。正常工作。

Answer 5

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<body>

<div id="bilal" title="Basic dialog">
  <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>


</body>

<script>

  $( function() {
    $( "#bilal" ).dialog({
    autoOpen: true,
  minWidth: 600,
  show: {
    effect: "clip",
    duration: 200
  },
  hide: {
    effect: "clip",
    duration: 200
  }
    });
  } );

</script>

试试此代码，在我的设置上进行测试。工作正常。感谢

未捕获的TypeError：jQuery（...）。对话框不是一个函数

5 个答案: