jQuery UI对话框无法拖动或调整大小。

Question

jQuery UI对话框无法拖动或调整大小。

3

我遇到了一个问题，就是无法使对话框可拖动和可调整大小。所有的文档和问题都让它听起来很简单，但我无法使它正常工作。你有什么想法，我可能做错了什么吗？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
<html>
<head>
    <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
    <SCRIPT TYPE="text/javascript" SRC="js/jquery-ui-1.8.10.custom.min.js"></SCRIPT>
    <SCRIPT TYPE="text/javascript">
$(document).ready(function(){
 $('#dialog-form').dialog({
//  autoOpen: false,
  height: 400,
  width: 350,
  modal: true,
  draggable: true,
  resizable: true,
  buttons: {
   Cancel: function() {
    $( this ).dialog( "close" );
   }
  },
  close: function() {
   alert('here');
  }
 });
});
    </SCRIPT>
        <link type="text/css" href="css/smoothness/jquery-ui-1.8.10.custom.css" rel="stylesheet" />
        <style>
#dialog-form label {float:left; width:100px;}
</style>
</head>
<body>

<div id="dialog-form" title="Create new product">
    <form>
    <fieldset>
        <label for="pt">Product Type</label>
        <input type="text" name="pt" id="pt" class="text ui-widget-content ui-corner-all" />
  <br>
        <label for="prod">Producer</label>
        <input type="text" name="prod" id="prod" class="text ui-widget-content ui-corner-all" />
    </fieldset>
    </form>
</div>

</body>
</html>

- lschult2

3个回答

1

你的代码肯定有问题... 你是否有效地加载了所有内容并按正确顺序进行了操作？

你的代码在 JsBin > http://jsbin.com/uqahu3/edit 中。

可以直接使用。

- balexandre

2

这很可能是问题所在 - 我曾经遇到过同样的问题，结果发现我的自定义jqueryui javascript没有包含必需的ui.mouse.js。 - Voodoo

0

我猜测你正在使用IE 6并且遇到了问题。如果你正在使用IE 6，请尝试包含bgiframe.js http://docs.jquery.com/Plugins/bgiframe

- Avitus

我希望有一种简单的方法让人们摆脱IE6。 - Avitus

1

我在搜索相关信息时偶然发现了这个，想回应@Avitus的评论...它就是这么简单。我的公司不支持IE。没有Chrome，没有Safari...除了Firefox什么都没有。无论是公司网站还是非公司网站，支持需求都一样。如果你不改变自己，就不能改变世界。员工可以自由选择浏览器，但他们知道如果遇到问题，非Firefox问题将得不到帮助。我们构建的网站只与Firefox进行测试。从互联网访问我们网站的流量会收到有关此事的消息。 - user1801810

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Lorenz Lo Sauer · Accepted Answer

那是因为可拖动脚本并不是自成体系的。您还需要包含一个鼠标事件处理库。

<script src="...../ui/jquery.ui.mouse.js"></script>

此外，除了

<script src="...../ui/jquery.ui.draggable.js"></script>

性能说明: 拖放功能会增加大约45kb（未压缩）的额外javascript代码。这几乎与获取基本UI功能所需的JQuery-UI代码量相同。