artDialog 升级到v6了,作者把代码结构做了重大调整,以前的很多习惯用法可能都需要改,在我用的时候,最让人蛋疼的就是content传入元素后的变化,2个重大变化
1.不在原来的元素位置放入占位div了,也就意味着你的元素用完就丢失句柄了
2.不再显示隐藏的元素了(感觉有点鸡肋),也就意味着,你要自己显示的控制元素的显示和隐藏了
解决办法:
1.在页面上放置需要用dialog显示的元素,style="display:none;";
2.在生成dialog之前保存元素的引用, var myEle = $("#myElement");
3.dialog显示后(这里自己测一下,我是在show方法调用之后显示元素的),调用元素的myEle.show();
4.关于dialog居中问题,作者已说:设定了width 和 height的话会自动居中
<script type=
"text/javascript"
>
var
companyHandler = {
testDiv:
null
,
init :
function
() {
var
me = companyHandler;
me.testDiv = $(
'#testDiv'
);
$(
'#btnTest'
).click(me.testHandler);
},
testHandler:
function
() {
var
me = companyHandler;
var
d = dialog({
title:
'test'
,
content: me.testDiv,
width:
'800px'
,
height:
'400px'
});
d.show();
me.testDiv.show();
}
};
$(
function
() {
companyHandler.init();
});
</script>
<button type=
"button"
id=
"btnTest"
class
=
"btn btn-default"
>Test</button>
<div
class
=
"row"
id=
"testDiv"
style=
"display: none;"
>
<div
class
=
"jumbotron"
>
<h1>Hello, world!</h1>
<p>This is a simple test.</p>
<p><a
class
=
"btn btn-primary btn-lg"
role=
"button"
>Learn more</a></p>
</div>
</div>
|