javascript - 将 var 从 div 传递给 jquery

Question

我正在使用 jquery 函数打开一个对话框，我需要能够更改框的高度和宽度。我想从 DIV 中传递一个参数。我研究了许多不同的可能性，但无济于事。任何想法将不胜感激。

$.fx.speeds._default = 1000;
$(function() {
    $("#dialog").dialog({
        autoOpen: false,
        height: 300,
        width: 500,
        show: "drop",
        hide: "drop"
    });
    $("#opener").click(function() {
        $("#dialog").dialog("open");
        return false;
    });
});

这是我的分区。

<div id="dialog">
   Some text here
</div>

Answer 1

Answer 2

根据文档，您可以调整窗口大小，设置最小/最大高度和宽度，并在调用.dialog()方法时将高度和宽度设置为选项。

从文档中：

$( ".selector" ).dialog({ width: 460 });

在 init 之后获取或设置宽度选项。

//getter
var width = $( ".selector" ).dialog( "option", "width" );
//setter
$( ".selector" ).dialog( "option", "width", 460 );

获取存储在 div 中的任何数据或参数并将其作为选项传递给方法应该非常简单.dialog()。

更新：

从您的评论中，您想要这样的东西：

小提琴

<div id="dialog" data-height="400" data-width="400" style="background-color: red;">
   Some text here
</div>
<a id="opener" href="#">Open dialog</a>​

$(document).ready(function() {
    $("#opener").click(function(e) {
        e.preventDefault();
        var dialogHeight = $("#dialog").data("height"),
            dialogWidth = $("#dialog").data("width");
        $("#dialog").dialog({
            height: dialogHeight,
            width: dialogWidth            
        });
        return false;
    });
});​