JavaScript Impersonation Popup Confirmation dialog box

Source: Internet
Author: User
Tags bind button type extend split

Such a universal window.

The code is as follows

construct () {


setting={


ID: ' Window ID ',


titletext: ",


content: ' Content Text ',//


parent:null,//window's parent handle is added to the body by default


boxcss: ' Class03_tank ',


titlecss: ' Class03_tank_top ',//title CSS


contentcss: ' PADTB10 ',//content CSS


width:280,


height: ' Auto ',


button: ' Submit,cancel ',//button type, submit: Commit, Cancel: Cancel


submitcall:null,//Click OK button callback


cancelcall:null//Click the Cancel button callback


}


function _createwindow (opt) {


var windowid=opt.id,top,left;


if (windowid==null)


return null;


if ($ (' # ' +opt.id). length>0) {


$ (' # ' +opt.id). Remove ();


}


if (!opt.left)


opt.left= ($ (window). Width ()-opt.width)/2;


if (!opt.top)


Opt.top = ($ (window). Height ())/3+$ (document). ScrollTop ()


var parent= (opt. Parent==null | | opt.parent.length==0)? $ (' Body '): $ (opt. Parent);


var box=$ (' <div> '). attr (' id ', windowid). addclass (OPT.BOXCSS). Width (opt.width). Height (opt.height). CSS ({ ' Left ': opt.left, ' top ': opt.top, ' z-index ': 1111, ' position ': ' absolute '};


parent.append (Box)


return $ (' # ' +opt.id);


}


function _setwindowconstruct (w,opt) {//Create form internal structure


W.subobj=w.obj;


//Create title


w.subobj.append ($ (' <div> '). addclass (' Class03_tank_top '). Append (


$ (' <div> '). addclass (' Class03_tank_topc '). Append (


w.close=$ (' <a> '). attr (' title ', ' Close '). AddClass (' Btnax fr bgcfff mart04 '). html (' x ')


). Append (


$ (' <span> '). addclass (' Disin_bl lineh30 marl10 '). html (OPT. TitleText)


)


)


)


//create content


W.subobj.append (


$ (' <div> '). addclass (' Class03_tank_con bgcfff '). css ({' text-align ': ' Center '}). Append (


$ (' <div> '). attr (' id ', ' content_ui_ ' +opt.id). addclass (opt. CONTENTCSS)


)


);


//Create bottom


w.subobj.append (' <div class= ' "style=" margin-top:0; " ><b class= "yz_b01" ></b><b class= "yz_b02" ></b><b class= "yz_b03 yz_b00" ></b> </div> ')


Return w;


}


function _setwindowsubmitbutton (w,opt) {//Set button


var p=$ (' <p> '). addclass (' class03_tank_p ');


var submit=$ (' <a> '), cancel=$ (' <a> ');


btn=opt.button.split (', ');


if (ST. Base.inarray (BTN, ' submit ') >-1) {


p.append (Submit.addclass (' btnqx01 '). html (' OK '). bind (' click ', Function () {


if ((Opt.submitcall&&opt.submitcall ()!==false) | | Opt.submitcall==null) {


$ (' # ' +opt.id). Remove ();


$ (' #MW_BACKOVER '). Hide ();


}


if (ST. Ui.timeid!=null)


Window.cleartimeout (ST. Ui.timeid);

}))
}
if (ST. Base.inarray (btn, ' Cancel ') >-1) {
P.append (Cancel.addclass (' btnqx01 marlr06 '). HTML (' Close '). Bind (' click ', function () {
if ((Opt.cancelcall&&opt.cancelcall ()!==false) | | Opt.cancelcall==null) {
$ (' # ' +opt.id). Remove ();
$ (' #MW_BACKOVER '). Hide ();
}
if (ST. Ui.timeid!=null)
Window.cleartimeout (ST. Ui.timeid);

})

W.close.bind (' click ', Function () {
$ (' # ' +opt.id). Remove ();
$ (' #MW_BACKOVER '). Hide ();
})
W.obj.children ('. Class03_tank_con '). Append (P)
}
Function _setbackover (w) { //Create Mask
if ($ (' #MW_ Backover '). length>0 {
$ (' #MW_BACKOVER '). Show ();
return;
}
$ ("Body"). Append (
$ ("<div>")
. attr ("id", "mw_backover")
. CSS ({
"Background-color": "#ddd",
Position: fixed,
Top: ' 0 ',
Left: ' 0 ',
' width ': ' 100% ',
' height ': ' 100% ',
' display ': ' Bloc K ",
Opacity: 0.5,
' Z-index ': Ten
})
";
}
return function (opt) {
Opt=st.extend (setting,opt);
//Create form container object
Var w=_createwindow (opt);
if (!w) {
return false;
}
windowobj={' obj ': w, ' subobj ': null};
Windowobj=_setwindowconstruct (windowobj,opt);
_setbackover ( windowobj,opt)
_setwindowsubmitbutton (windowobj,opt);
Return {
Getobject:function () {
return Windowobj;
},
Close:function () {
$ (windowobj[' obj ']). Remove ();
$ (' #MW_BACKOVER '). Hide ();
return this;
},
Setcontent:function (content) {
$ (' #content_ui_ ' +opt.id). HTML (content);
return this;
},
Load:function (url,callback) {
$ (' #content_ui_ ' +opt.id). Load (url+ ' &r= ' +math.random (), callback);

Return this;
}

}
}
Return function (option) {
Controller=construct (),
return Controller (option)
}
}) (),
//Static dialog
Staticwindow: (function () {
var controller=null;
function _construct (opt) {
setting={
ID: ',
left:0,
top:0,
width:200,
height:100,
CSS: ' Bgcfff ',
Parent: ',
Buttoncss: ' class03_tank_p ',
buttoncssrep:null, //button Additional parameters
Button: ' sure,cancle ',
Buttontext:null,  //button Append text
Layer:null
}
Function _createwindow (opt) {
if ($ (' # ' +opt.id). length>0)
$ (' # ' +opt . ID). Remove ();
if (opt.layer!=null) {
opt.left= (Opt.layer.pageX);
opt.top= (opt.layer.pagey+$ (opt.layer.target). Height ());
}

Var box=$ (' <div> '). addclass (OPT.CSS). css ({' position ': ' absolute ', ' height ': opt.height, ' width ': opt.width, ' Border ': ' 1px solid #ccc ', ' z-index ': +, ' Left ': opt.left, ' top ': opt.top}. attr (' id ', opt.id),
parent=opt.parent! = '? $ (opt.parent): $ (' body ');
Parent.append (box);
Return $ (' # ' +opt.id);
};
Function _setwindowconstruct (obj,opt) {
obj.html (')
Obj.append (' <div> '). attr (' id ', ' static_ Content_ ' +opt.id) '
}
Function _setbutton (obj,opt) {
Btn=opt.button.split (', ');
p=$ (' <p> '). AddClass (OPT.BUTTONCSS). css ({' position ': ' absolute ', ' bottom ': 0, ' width ':(opt.width-13)})
if (opt.buttoncssrep! =null)
P.css (opt.buttoncssrep);
if (ST. Base.inarray (btn, ' sure ') >-1) {
var sure=$ (' <a> '). addclass (' btnqx01 '). HTML (' confirmation '). Click (function (e) {
if (OPT.SUREBTN&&OPT.SUREBTN (e)!==false) | | Opt.surebtn==null) {
Obj.remove ();
}
})
P.append (sure)
}
if (ST. Base.inarray (btn, ' cancle ') >-1) {
cancel=$ (' <a> ').AddClass (' btnqx01 marlr06 '). html (' Cancel '). Click (function (e) {
if (opt.cancelbtn&&opt.cancelbtn (e)!== False) | | Opt.cancelbtn==null) {
Obj.remove ();
}
})
P.append (cancel);
}
if (opt.buttontext!=null)
P.append (opt.buttontext)
Obj.append (p)

}
return function (opt) {
Opt=st.extend (setting,opt);
var w=_createwindow (opt);
if (!w) return false;
_setwindowconstruct (w,opt);
_setbutton (w,opt);
return{
Close:function () {
W.remove ()
},
Setcontent:function (content) {
$ (' #static_content_ ' +opt.id). HTML (content);
},
Append:function (obj) {
$ (' #static_content_ ' +opt.id). append (obj);
},
Load:function (Url,callback) {
$ (' #static_content_ ' +opt.id). Load (Url,callback)
}
}
}
}
return function (option) {
Controller=_construct ();
return Controller (option);
}
})()
}

}

I've written two of them here. There is also the absence of a title. Only the Content dialog box.
How to use

The code is as follows

var w=st. Ui. Modewindow ({
' ID ': ' Window ID ',
' TitleText ': ' title ',
' Submitcall ': function () {
Confirm how the button executes
},
' Cancelcall ': function () {
How to cancel a button execution
},
' Width ': ' Width ',
' Height ': ' High ',
' Boxcss ': ' Form style ',//
' Titlecss ': ' Heading style ',
' Contentcss ': ' Content style ',
' button ': ' Submit,cancel ',//Default two buttons. One of these can be set individually
});


Parameters are optional.
W is the object of the form.
W.close ()//close form
W.setcontent (' content ');/set Content
W.getobject ()//Get Form Object
W.load (' Load connection ', ' callback function ');//Load a URL
The static dialog box uses the same method as the modal dialog box.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.