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。

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

Answer 1

我们将这种类型的语法添加到我们的jQuery安装文件中。这允许开发人员轻松实现这样的事情，而不必编写大量的JavaScript。

http://jsfiddle.net/iknowkungfoo/C4Zz6/20/

<强> HTML

<div id="foo" class="dialog" data-width="100">Hello</div>
<a id="trigger" href="#">Open</a>

<强>的JavaScript

$(document).ready(function(){

    var $_foo = $( "#foo" ), dW = 200, dH = 200

    $_foo.dialog({
        autoOpen: false,
        height: dH,
        width: dW
    });

    $('#trigger').on("click", function(e){

        var params = { 
            height: ($_foo.data("height") ? $_foo.data("height") : dH),
            width: ($_foo.data("width") ? $_foo.data("width") : dW)
        }

        $_foo.dialog(params).dialog("open");

        e.preventDefault();

    });

});

Answer 2

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

来自文档：

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

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

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

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

<强>更新

根据您的评论，您需要以下内容：

<强> The fiddle

<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;
    });
});

从div传递var到jquery

2 个答案: