1.引入文件：
使用前需包含以下jquery.js、bgiframe.js、weebox.js、wee.css文件
2.基本用法舉例如下:
<script type="text/javascript"> $.weeboxs.open('#testbox', { title: 'hello world', width:400, height: 200 }); $.weeboxs.open('The operation failed.',{ onopen:function(){ alert('opened!'); }, onclose:function(){ alert('closed!'); }, onok:function(){ alert('ok'); $.weeboxs.close(); } }); $.weeboxs.open('/modules/test/testsession.php', { contentType:'ajax' }); $.weeboxs.open('hello world'); $.weeboxs.open('The operation failed.',{type:'error'}); $.weeboxs.open('The operation failed.',{type:'wee'}); $.weeboxs.open('The operation failed.',{type:'success'}); $.weeboxs.open('The operation failed.',{type:'warning'}); $.weeboxs.open('Autoclosing in 5 seconds.', { timeout: 5 }); </script>
3.以下是默認選項:
boxid: null, //設定了此值只后，以后在打開同樣boxid的彈窗時，前一個將被自動關閉
boxclass: null, //給彈窗設置其它的樣式，用此可以改變彈窗的樣式
type: 'dialog', //彈窗類型，目前有dialog,error,warning,success,wee,prompt,box六種
title: '', //彈窗標題
width: 0, //彈窗寬度,不設時，會自動依據內容改變大小
height: 0, //彈窗高度(注意是內容的高度,不是彈窗的高度)
timeout: 0, //自動關閉的秒數，設置此值后，窗口將自動關閉
draggable: true,//是否可以拖拽
modal: true, //是否顯示遮照
overlay: 75, //遮照透明度
focus: null, //彈窗打開后，焦點移到什么元素上，默認移到取消按鈕到
position: 'center',//彈窗打開后的默認為中間，設置為element時，需要設置trager選項，
trigger: null, //顯示位置的參照元素，為一個元素id
showTitle: true,//是否顯示標題
showButton: true,//是否顯示按鈕，包括確定和取消
showCancel: true, //是否顯示取消按鈕
showOk: true, //是否顯示確定按鈕
okBtnName: '確定',//"確定"按鈕名稱
cancelBtnName: '取消',//"取消"按鈕名稱
contentType: 'text',//內容獲取方式，目前有三種text,selector,ajax
contentChange: false,//為selector時
clickClose: false, //點擊不在彈窗上時，是否關閉彈窗
zIndex: 999,//默認彈窗的層
animate: false,//效果顯示
onclose: null, //彈窗關閉時觸發的函數
onopen: null, //彈窗顯示前觸發的函數, 此時內容已經放入彈窗中，不過還沒有顯示出來
onok: null //點擊確定按鈕觸發的函數
疑難雜症問題：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="weebox/jquery.min.js"></script> <script type="text/javascript" src="weebox/bgiframe.js"></script> <script type="text/javascript" src="weebox/weebox.js"></script> <link type="text/css" rel="stylesheet" href="weebox/weebox.css" /> <script type="text/javascript"> function get() { $.weeboxs.open('users.php', { title:'請選擇:', contentType:'ajax', width:800, height:800, onok:function(box){ var text = ""; var sumEmail = 0; var textView = ""; $("input[name='invitees[]']:checked").each(function() { text += ","+$(this).val(); }); //$.post("1.php",{'email':text}); sumEmail = $("input[name='invitees[]']:checked").length; $("#invite").text('共邀請'+sumEmail+'人，名單如下：'); $("#email").val(text); textView = text.substr(1).replace(new RegExp(/(,)/g),"; "); $("#emailView").html(textView); //window.close();正常情況下這里這樣寫是可以的，但是有時候竟然要加個參數box才能點 //確定的時候關閉窗口。 box.close(); } }); } </script> </head> <body> <!-- 這里用<button onclick="get();return false;"></button>也可以， 但是在IE8,IE9下會直接把表單給提交了。《<button></button>有自動提交表單的特性》 --> <input type="button" value="點此邀請" onclick="get();"> </body> </html>