layer - 简单好用的Web弹出层组件使用详解7（常用的回调方法）

十三、提示框常用的回调方法

1，窗口拉伸动作回调

当我们拖拽提示框右下角对窗体进行尺寸调整时，会触发 resizing 这个回调方法。该回调返回一个参数：当前提示框的 DOM 对象。

layer.alert('欢迎访问 hangge.com', {

resizing: function(layero){

console.log(layero);

}

});

2，窗口拖动回调

当我们拖动提示框改变位置后，会触发 moveEnd 这个回调方法。该回调返回一个参数：当前提示框的 DOM 对象。

layer.alert('欢迎访问 hangge.com', {

moveEnd: function(layero){

console.log(layero);

}

});

3，确定按钮点击回调

当确定按钮（第一个按钮）点击后会调用 yes 这个方法，该方法携带如下两个参数：

当前提示框的索引
当前提示框的DOM对象

layer.open({

content: '欢迎访问 hangge.com',

yes: function(index, layero){

//do something

layer.close(index); //如果设定了yes回调，需进行手工关闭

}

});

4，右上角关闭按钮点击回调

（1）当点击提示框右上角的关闭按钮时，会调用 cancel 这个方法，该方法携带如下两个参数：

当前提示框的索引
当前提示框的 DOM 对象

（2）默认情况下点击关闭按钮会自动触发关闭提示框这个行为。如果不想关闭，则 return false 即可。

layer.alert('欢迎访问 hangge.com', {

cancel: function(index, layero){

if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭

layer.close(index)

}

return false;

}

});

5，窗口弹出后的回调

如果我们想在弹出框显示完毕时执行一些语句，使用使用 success 这个回调方法。该方法携带如下两个参数：

当前提示框的 DOM 对象
当前提示框的索引

layer.alert('欢迎访问 hangge.com', {

success: function(layero, index){

console.log(layero, index);

}

});

6，弹出框销毁回调

无论是确认还是取消，只要弹出框被销毁了，end 这个回调方法都会执行。该方法不携带任何参数。

layer.alert('欢迎访问 hangge.com', {

end: function(){

console.log("弹出框被销毁了");

}

});

7，最大化、最小化、还原后触发的回调

弹出框最大化、最小化、还原后分别会触发 full、min、restore 这几个回调方法。这些方法都只携带一个参数：当前提示框的 DOM 对象。

layer.open({

type: 1,

area: ['500px', '200px'],

content: '欢迎访问 hangge.com',

maxmin: true,

full: function(layero){

console.log("窗口最大化了!");

},

min: function(layero){

console.log("窗口最小化了!");

},

restore: function(layero){

console.log("窗口还原了!");

}

});

8，layer 组件初始化就绪回调

由于 layer 内置了轻量级加载器，所以我们根本不需要单独引入 css 等文件。但是加载总是需要过程，如果我们需要在页面一打开就要执行弹层时，那么最好是将弹层放入 ready 方法中，如：

//页面一打开就执行弹层

layer.ready(function(){

layer.msg('很高兴一开场就见到你');

});