### **关于弹窗的使用说明**
### 用法:
### 实例化对象
* * * * *
var my = new myFrame();
#### 直接调用该对象下的popups()函数
* * * * *
my.popups({
参数1:参数值1,
参数2:参数值2,
...
});
#### 根据需要传入对应的参数
* * * * *
my.popups({
//表示点击阴影部分关闭弹窗
"shadeClose":false,
//弹窗内容
"content":'<div class="content">添加老师微信:<span class="wxnumber wechat"></span</div>',
//表示按钮集合
"btn":['<span class="no">关闭</span>','<span class="yes">跳转</span>'],
//点击关闭按钮事件,no表示关闭按钮类名,事件内容随意编写
"no":function(){
$('.tc_bg').fadeOut();
},
//点击确定按钮事件,yes表示跳转按钮类名,事件内容随意编写
"yes":function(){
window.location.href = 'http://www.baidu.com';
}
});
#### 参数说明:
* * * * *
| 参数名称 | 参数值 | 默认值 | 其他 |
| --- | --- | --- | --- |
| shadeClose | true、false | 默认值为true | 表示是否为点击阴影部分关闭弹窗 |
| content | 接收html+css | 默认为空白区域 | 弹窗中的内容 |
| btn | 接受html+css的按钮组集合 | 默认一个关闭按钮 | 每个按钮必须有一个类,否则无法返回点击该按钮后所触发的事件,可接收任意个按钮 |
| no | 值为点击按钮触发的函数 | 函数内容根据需要编辑 | 点击关闭按钮触发的函数 |
| yes | 值为点击按钮触发的函数 | 函数内容根据需要编辑 | 点击确定按钮触发的函数 |
### 注意事项:
* * * * *
1. 弹窗的按钮个数可以任意添加,点击按钮的触发事件函数的函数名必须为该按钮的类名,如上述中的no、yes等;
2. 按钮所触发的函数内容可以任意发挥;
3. 传入的参数中可以附带行内样式;
4. 推广页面中,如需在弹窗中添加二维码或微信号等信息时,需另外执行函数来手动添加,否则无效;如下所示:
* * * * *
function txt(){
//实例化对象
var my = new myFrame();
//调用该对象下的popups()函数
my.popups({
//是否点击阴影部分关闭弹窗
"shadeClose":false,
//弹窗内容
"content":'<div class="content">添加老师微信:<span class="wxnumber wechat"></span></div>',
//弹窗的小按钮
"btn":['<span class="no">关闭</span>','<span class="yes">跳转</span>'],
//弹窗的小按钮事件函数
"no":function(){
$('.tc_bg').fadeOut();
},
//弹窗的小按钮事件函数
"yes":function(){
window.location.href = 'http://www.baidu.com/';
}
});
//重新渲染微信号
$('.wechat').text($('.wechat').eq(0).text());
//执行微信号长按复制功能
$('.wxnumber').longPress(function(){
Tajs('copynum');
})
}
### 完整示例:
* * * * *
function txt(){
//实例化对象
var my = new myFrame();
//调用该对象下的popups()函数
my.popups({
//是否点击阴影部分关闭弹窗
"shadeClose":false,
//弹窗内容
"content":'<div class="content">添加老师微信:<span class="wxnumber wechat"></span></div>',
//弹窗的小按钮
"btn":['<span class="no">关闭</span>','<span class="yes">跳转</span>'],
//弹窗的小按钮事件函数
"no":function(){
$('.tc_bg').fadeOut();
},
//弹窗的小按钮事件函数
"yes":function(){
window.location.href = 'http://www.baidu.com/';
}
});
}