2

我想使用 jquery 使我的 div 可拖动和调整大小。这是一个简单的div:

<div id="dialog-modal-alerts" title="Alerts" style="display:none;"></div>

这就是我使用 jquery 的方式:

$("#dialog-modal-alerts").dialog({
            height: 500,
            width: 900,
            title: strTitle,
            resizable:true,
            draggable:true,
            dialogClass: "alertDialog",
            //buttons: [{ text: "Ok", click: function() { $( this ).dialog( "close" ); } }],
            close: function (event, ui) { closeDialog(number) },
            modal: true
        });

它不起作用。如果我写它会起作用

$(function () {
        $("#dialog-modal-alerts").draggable();
    });

但如果我写

$(function () {
        $("#dialog-modal-alerts").resizable();
    });

它仍然无法正常工作有人可以帮助解决我的问题吗?

4

2 回答 2

3

你检查了吗?默认情况下,它是可拖动的对话框并且可以调整大小

http://jqueryui.com/dialog/#modal

它是关于 strTitle 尝试删除它并添加“Title”或任何内容并 close(number) 确保 number 和 strTitle 作为有效变量存在。

我创建了这个例子我工作正常:

    <div id="dialog-modal-alerts" title="Alerts" style="display:none;">

        Hlllo
        Ahmed Alaa<br />

    </div>

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
      $(function () {
          $("#dialog-modal-alerts").dialog({
              height: 500,
              width: 900,
              title: 'Hi',
              resizable: true,
              draggable: true,
              dialogClass: "alertDialog", 
              modal: true
          });
      });

于 2013-08-20T20:09:53.363 回答
0

我最好的猜测是,您的一个函数中存在一些您没有向我们展示的问题,可能是语法错误,导致它无法完成代码。我这样说是因为我可以成功执行您的代码段并实现所需的行为。也许我完整的pastebin会有所帮助。

注意单独调用

$("#dialog-modal-alerts").draggable();

预计会起作用,因为这是一个记录在案的 jquery ui 方法。您可以将任何项目标记为可拖动,无论它是否是模式对话框,这就是您所做的。

另一方面,

$("#dialog-modal-alerts").resizable();

预计不会起作用,因为可调整大小不是它自己的功能。

于 2013-08-20T20:19:38.050 回答