layerUI弹层组件使用

type参数 0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）

// 1.页面层
layer.open({
  type: 1, 
  content: '传入任意的文本或html' //这里content是一个普通的String
});
layer.open({
  type: 1,
  content: $('#id') //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
});
//Ajax获取
$.post('url', {}, function(str){
  layer.open({
    type: 1,
    content: str //注意，如果str是object，那么需要字符拼接。
  });
});

//2.iframe层
layer.open({
  type: 2, 
  content: 'http://sentsin.com' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
}); 

// 3.tips层
layer.open({
  type: 4,
  content: ['内容', '#id'] //数组第二项即吸附元素选择器或者DOM
}); 

btn按钮回调

// 咨询框
layer.confirm('纳尼？', {
  btn: ['按钮一', '按钮二', '按钮三'], //可以无限个按钮
  btn3: function(index, layero){
    //按钮【按钮三】的回调
  }
}, function(index, layero){
  //按钮【按钮一】的回调
}, function(index){
  //按钮【按钮二】的回调
});


// 多个按钮回调
layer.open({
  content: 'test'
  ,btn: ['按钮一', '按钮二', '按钮三']
  ,yes: function(index, layero){
    //按钮【按钮一】的回调
  }
  ,btn2: function(index, layero){
    //按钮【按钮二】的回调
    //return false 开启该代码可禁止点击该按钮关闭
  }
  ,btn3: function(index, layero){
    //按钮【按钮三】的回调
    //return false 开启该代码可禁止点击该按钮关闭
  }
  ,cancel: function(){ 
    //右上角关闭回调
    //return false 开启该代码可禁止点击该按钮关闭
  }
});

确定yes和关闭cancel

layer.open({
  content: '测试回调',
  yes: function(index, layero){
    //do something
    layer.close(index); //如果设定了yes回调，需进行手工关闭
  },
  cancel: function(index, layero){ 
     if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时，该层才会关闭
        layer.close(index)
     }
     return false; 
   }    
}); 

来源：oschina

链接：https://my.oschina.net/qinghuo111/blog/4881653