jQuery UI对话框追加到Div [英] Jquery UI dialog Append to Div
问题描述
我正在使用以下代码创建一个Jquery-UI对话框.
I'm creating a Jquery-UI dialog using the code below.
var dynDiv = document.createElement("div");
document.getElementById("divparent").appendChild(dynDiv);
dialog_box(dynDiv, buttons);
function dialog_box(dynDiv, dialog_buttons) {
$.each(dialog_buttons, function (index, props) {
$("#" + dynDiv.id).append('<span id="btn' + dynDiv.id + props.id + '">' + props.text + '</span>');
$('#btn' + dynDiv.id + props.id).button().on("click", {
param: props,divid: dynDiv.id
}, props.handler);
});
$("#" + dynDiv.id).dialog({
modal: true,
appendTo: "#divparent",
show: "puff",hide: "explode",resizable: true,closeOnEscape: false,
minWidth: 200,
minHeight: 150
});
http://jsfiddle.net/DOmEl/qNGEw/41/ 据此,应该创建一个jquery对话框并将其附加到 divparent .但是它没有按预期进行追加,因此创建了一个单独的节点并形成了对话框.谁能找出我做错了什么地方?
http://jsfiddle.net/DOmEl/qNGEw/41/ According to this a jquery dialog should be created and append to divparent. But its not appending as expected, its created a seperate node and formed the dialog. Can anyone figure out where i made wrong?
推荐答案
该对话框实际上将appendTo #divparent1
了.
问题似乎在于它的位置是绝对的.
The dialog actually did appendTo #divparent1
.
The problem seems to be that its position is absolute.
再次尝试将#divparent
的位置更改为absolute
:
Try changing the position of #divparent
to absolute
again apply this fix:
$("#" + dynDiv.id).dialog({
modal: true,
appendTo: "#divparent1",
show: "puff",
hide: "explode",
resizable: true,
closeOnEscape: false,
minWidth: 200,
minHeight: 150,
position: { my: "left top", of: "left top"}
});
您可以在此处检查结果: http://jsfiddle.net/qNGEw/46/
You can check the result here: http://jsfiddle.net/qNGEw/46/
这篇关于jQuery UI对话框追加到Div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!