jquery弹出代码封装dialoghelper
看到JQueryUI对话框的例子，效果很好，有点尴尬，写代码有点拧，需要重新包装！所以有以下简单的dialoghelper辅助类，因为这篇文章的主要思想是思维，所以当前版本的代码也很粗糙。思维方式是，什么是封装后只是一种形式。我希望这个想法能启发你，欢迎大家打开思路，提出更好的改进建议。复制代码代码如下所示：
/ /需要scrollhelper.js
函数的DialogHelper（）{
无功_this =这；
var doc = window.document；
_this.maskdiv = null；
_this.contentdiv = null；
var选项{ {
不透明度：0.4
}；
this.popup =功能（contentdiv，optionarg）{
如果（optionarg）{
对于（在optionarg VAR PROP）{
选择{道具} = optionarg {道具}；
}
}
_this.contentdiv = contentdiv _this.contentdiv | |；
_this.maskdiv = $（）；
_this.maskdiv.addclass（'maskdiv）；
_this.maskdiv.css（{
过滤器：阿尔法（透明度=+（options.opacity 0 ）* 100 +）；
不透明度：options.opacity，
显示：阻止
}）；
$（DOC。体）。追加（_this。maskdiv）；
如果（_this。contentdiv）{
$（DOC。体）。追加（_this。contentdiv）；
_this.contentdiv.show（）；
_this.contentdiv.draggable（{
遏制：文档
光标：'move，
手柄：。dialog_head
}）；
（_this美元。maskdiv），（MouseMove
$（体）的PreventScroll（）；
}）；
（_this美元。maskdiv），（mouseout
$（体）的LiveScroll（）；
}）；
如果（$（。CKE）。长度= = 0美元（。dialog_body）。长> 0）{
$（。dialog_body ）PreventOuterScroll（）；
}
}
}；
this.remove =函数（）{
如果（_this。contentdiv）{
_this.contentdiv.remove（）；
}
如果（_this。maskdiv）{
_this.maskdiv.remove（）；
}
$（体）的LiveScroll（）；
}；
this.formatpercentnumber =功能（价值、整体）{
如果（isnan（值）的值为字符串）{
如果（value.indexof（%）！= = 1）{
价值=（value.replace（%
如果别人}（value.indexof（PX）！= = 1）{
价值= value.replace（PX
}
}
返回math.ceil（价值）；
}；
this.position =功能（对话框，dialogbody，minusheight）{
对话框=对话框| |美元（。showdialogdiv ）；
如果（对话框{ 0 }）{
无功clientwidth = document.documentelement.clientwidth；
自己的document.documentelement.clientheight var =；
Var width = _this.formatPercentNumber (dialog.data (position).Width, clientWidth (dialog.width) ||);
Var height = _this.formatPercentNumber (dialog.data (position).Height, clientHeight (dialog.height) ||);
宽度=宽度< 300300：宽度；
高度=高度＜450450：高度；
$（对话框）Css（{
宽度：宽度+
高度：高度
顶：Math.ceil（（自己的身高） / 2）+PX
左：Math.ceil（（（clientwidth宽度） / 2）+PX
}）；
dialogbody = dialogbody | | $（。dialog_body ）；
如果（dialogbody { 0 }）{
minusheight = minusheight | |（$（。dialog_head ）（。网页）+ $（。dialog_foot ）（。网页））；
无功dialogbodyheight =高度minusheight；
DialogBody.height（dialogbodyheight）；
}
}
}
}
无功createdialogtemplate =功能（optionarg，contenthtml，savebtnclickhandler）{
var选项{ {
动作：
标题：
宽度：50%
高度：50%
}；
如果（optionarg）{
对于（在optionarg VAR PROP）{
选择{道具} = optionarg {道具}；
}
}
无功newdialog = $（）；
无功dialoghead = $（）。AppendTo（newdialog）；
.html（）（）（options.action ++ +选项。标题）AppendTo（dialoghead）；
Var DialogClose = $（）。AppendTo（dialoghead）；
无功dialogbody = $（）。Html（contenthtml）。AppendTo（newdialog）；
Var DialogFoot = $（）。AppendTo（newdialog）；
无功newdiv = $（）。AppendTo（dialogfoot）；
Var ActionCancelDiv = $().AppendTo (newDiv);
dialogclose.on（单击
DialogHelper.remove（）；
}）；
actioncanceldiv.on（单击
DialogHelper.remove（）；
}）；
VaR消息=美元（），AppendTo（actioncanceldiv）；
$（），AppendTo（德国）；
$（）。Html（取消），AppendTo（德国）；
无功actionsavediv = $（）。AppendTo（newdiv）；
VaR新手=美元（），AppendTo（actionsavediv）；
NewB.on ('Click', function () {() {
如果（typeof savebtnclickhandler = =功能）{
SaveBtnClickHandler（）；
}
}）；
$（）。AppendTo（新手）；
$（）。Html（救）。AppendTo（新手）；
无功minusheight =（）+（）dialogfoot.outerheight dialoghead.outerheight；
newdialog.data（位置
宽度：选项宽度，
高度：选项高度
}）；
dialoghelper.position（newdialog，dialogbody，minusheight）；
返回newdialog；
}；
Var changeDialogLayout = function (optionArg, dialobj) {
var选项{ {
宽度：70%
高度：90%
}；
如果（optionarg）{
对于（在optionarg VAR PROP）{
选择{道具} = optionarg {道具}；
}
}
无功dialogbody = $（dialobj）。找到（。dialog_body ）；
无功dialoghead = $（dialobj）。找到（。dialog_head ）；
Var DialogFoot = $（dialobj）。找到（。dialog_foot ）；
其他math.round VaR（dialogbody.css（垫顶）。更换（ / / IG } { A-Z，））+ math.round（dialogbody.css（垫底）。更换（ / / IG } { A-Z，)))))；
无功minusheight = dialoghead.outerheight（）+（）+其他dialogfoot.outerheight；
dialobj.data（位置
宽度：选项宽度，
高度：选项高度
}）；
dialoghelper.position（dialobj，dialogbody，minusheight）；
}；
以上是本文的全部内容，希望您能喜欢。