js弹出层插件 -- weebox 方维系统

$("#weixin").click(function()
    {
        var _html=\'<img src="{$TMPL}/images/invitation/generate.png"  id="generate">\'        
        $.weeboxs.open(_html,{contentType:\'text\',showButton:false,showTitle:false, clickClose: true,type:\'wee\',onopen:function()
        {
            setTimeout(function()
            {
                init_ui_textbox();
                init_ui_select();
                init_ui_checkbox();
            },200);                
        }});
    });

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>