对话框函数错误无效函数

Question

TypeError：$(“”).html(“每次都会显示此对话框！”).dialog不是函数

这就是我得到的错误。在索引页面的div中使用load()加载页面。我已经将必要的jquery内容包括在索引页面(我更喜欢保持这种方式)、加载的页面以及两者中，并且它仍然可以这样做。我不确定到底是怎么回事。我知道处理load()页面比处理页面本身要困难得多，但即使转到页面home.php，它也会显示出来。下面是加载页面的链接，如果你想查看索引，只需删除地址中的home.php即可。

The page that is being loaded

这是我正在使用的函数：

<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.ui.core.js"></script>
    <script type="text/javascript" src="js/jquery.ui.draggable.js"></script>
    <script type="text/javascript" src="js/jquery.ui.mouse.js"></script>
    <script type="text/javascript" src="js/jquery.ui.position.js"></script>
    <script type="text/javascript" src="js/jquery.ui.resizable.js"></script>
    <script type="text/javascript" src="js/jquery.ui.widget.js"></script>

    <script type="text/javascript">
    function readMore(id,title,cat,desc,post,auth) {
        //alert(id +","+ title +","+ cat +","+ desc +","+ post +","+ auth);
        var $dialog = $('<div></div>').html('This dialog will show every time!').dialog({autoOpen: false,title: 'Basic Dialog'});
        $dialog.dialog('open');
        $dialog.title = title;
        $dialog.html(desc);
    }
    </script>

就像现在一样，所有的includes for对话框都在加载页面上，而不是在索引页面上，但就像我说的，我已经尝试了其中一个或两个，都没有用。另外，alert运行良好，可以正确地传递所有内容，并且在我想要调用它的时候会被调用。所有指向jquery包含的路径都是正确的。

如果出于某种原因，它有助于缩小范围，那么我在页面加载时也会遇到错误: TypeError：$.widget不是这个错误的函数中断

_uiHash: function(event) {

jquery...able.js (504行)

TypeError:在此错误中，$.widget不是函数分隔符

_mouseCapture: function(event) { return true; }

jquery...ouse.js (第162行)

TypeError:在此错误中，$.widget不是函数分隔符

ui: function() {

Answer 1

您还需要：

• jquery.ui.button.js
• jquery.ui.dialog.js

同样，把鼠标放在draggable之前，正如Musa上面评论的那样，这很重要。

摘要：

1. jquery.ui.core.js
2. jquery.ui.widget.js
3. jquery.ui.mouse.js
4. jquery.ui.position.js
5. jquery.ui.draggable.js
6. jquery.ui.resizable.js
7. jquery.ui.button.js
8. jquery.ui.dialog.js

但是，我建议从CDN加载完整的UI，而不是加载所有的单个文件。

 <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

Answer 2

jquery.ui.mouse、jquery.ui.draggable和jquery.ui.resizable需要跟在jquery.ui.widget后面，因为它们调用.widget()，而且widget使用position，所以把它放在前面。

<script type="text/javascript" src="js/jquery.ui.position.js"></script>
<script type="text/javascript" src="js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="js/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="js/jquery.ui.draggable.js"></script>
<script type="text/javascript" src="js/jquery.ui.resizable.js"></script>