2

更新:对不起,我让这个问题变得复杂。


我想问的是,当对话框高度变大时,如何将按钮的位置“修复”到 jQueryUI 对话框的底部。

我有一个 jQueryUI 对话框,如下所示:

<head>
$(function(){
    $("#ChooseStoryCategory").dialog({
        autoOpen: false,
        title: "Upload",
        height: 600,
        width: 500,
        modal: true
    }); 
});
</head>

我在对话框中添加了两个按钮,我总是想把它们放在bottom of the dialog. 这是代码:

<body>
<div id= "ChooseStoryCategory">
    <div id="storyCategory"></div>      

    <div><button id="ChooseCategory"><img src= "../pic/chooseOk.png"/></button></div>
    <div><button id="CategoryCancel"><img src= "../pic/close.png"/></button></div>
</div>
</body>

css设置:

#ChooseCategory{
    position: absolute;
    left: 30%;
    top: 85%;
    bottom: 0;

}

#CategoryCancel{
    position: absolute;
    left: 70%;
    top: 85%;
    bottom: 0;
}

但我总是会像这样增加对话框内的元素:

for(multiple times)://pseudocode
var categoryName= "PressNum1";
var value= 3;
var $btn= $('<button/>').text(categoryName).width(400).height(80);
$btn.bind('click', function(){console.log(value)});
$("#storyCategory").append($btn);

随着添加按钮的增加,它们的位置将超过两个按钮(ChooseCategoryCategoryCancel)。如何将两个按钮停靠在 jQueryUI 对话框的底部?

我试图获得两个按钮的初始顶部位置。随着每个按钮都添加到对话框中,我只需更改two buttons.

$("#CategoryCancel").css("height") = $("#ChooseStoryCategory").css("height") * 0.85 + $btn.css("height");

$("#ChooseStoryCategory").css("height") * 0.85 + $btn.css("height");

没有添加px,它只是结合了数字和字符串......


是否有任何简单的替代方法可以将两个按钮停靠在 jqueryUI 对话框的底部?

4

1 回答 1

4

为什么不使用该buttons选项?

$( "#ChooseStoryCategory" ).dialog({
  autoOpen: false,
  title: "Upload",
  height: 600,
  width: 500,
  modal: true
  buttons: {
    "Choose category": function() {
      // Do something
      $( this ).dialog( "close" );
    },
    Cancel: function() {
      $( this ).dialog( "close" );
    }
  }
});

查看 jquery-ui 页面中的示例:http: //jqueryui.com/dialog/或查看 API 文档:http ://api.jqueryui.com/dialog/#option-buttons

这是 jsFeedle: http: //jsfiddle.net/6gb4v/(拿起@rusln fiddle 并从那里开始)。

于 2013-06-28T04:21:39.367 回答