• layui 各种弹出框


    第一步:引用文件

    第二步:写脚本

    <script>

    //iframe窗
    //layer.open({
    // type: 2,
    // title: false,
    // closeBtn: 0, //不显示关闭按钮
    // shade: [0],
    // area: ['340px', '215px'],
    // offset: 'rb', //右下角弹出
    // time: 2000, //2秒后自动关闭
    // anim: 2,
    // content: ['text1.html', 'no'], //iframe的url,no代表不显示滚动条 右下角页面
    // end: function () { //此处用于演示
    // layer.open({
    // type: 2,
    // title: '很多时候,我们想最大化看,比如像这个页面。',
    // shadeClose: true,
    // shade: false,
    // maxmin: true, //开启最大化最小化按钮
    // area: ['893px', '600px'],
    // content: 'text.html' //最大化页面
    // });
    // }
    //});


    //初体验
    //layer.alert('内容')
    //第三方扩展皮肤

    //layer.alert('内容', {
    // icon: 1,
    // skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则,去这里查阅
    //})


    //询问框
    //layer.confirm('您是如何看待前端开发?', {
    // btn: ['重要', '奇葩'] //按钮
    //}, function () {
    // layer.msg('的确很重要', { icon: 1 });
    //}, function () {
    // layer.msg('的确是奇葩', { icon: 1 });
    //});


    //提示层
    //layer.msg('玩命卖萌中', function () {
    // //关闭后的操作
    //});

    layer.msg('更新成功',{time:1000}, function () {
    parent.location.reload();    //刷新父页面   第二个参数设置msg显示的时间长短
    });


    //墨绿深蓝风

    //layer.alert('墨绿风格,点击确认看深蓝', {
    // skin: 'layui-layer-molv' //样式类名
    // , closeBtn: 1
    //}, function () {
    // layer.alert('偶吧深蓝style', {
    // skin: 'layui-layer-lan'
    // , closeBtn: 1
    // , anim: 4 //动画类型
    // });
    //});


    //页面层
    //layer.open({
    // type: 1,
    // skin: 'layui-layer-rim', //加上边框
    // area: ['auto', 'auto'], //宽高
    // content: '<div id="dd" style="border:1px solid red;100px; height:100px;background-color:pink;">今天要下雪了</div>'
    //});


    //自定页
    //layer.open({
    // type: 1,
    // skin: 'layui-layer-demo', //样式类名
    // closeBtn: 1, //0不显示关闭按钮
    // anim: 2,
    // shadeClose: true, //开启遮罩关闭
    // content: '<div id="dd" style="border:1px solid red;100px; height:100px;background-color:pink;">今天要下雪了</div>'      也可以跳转到某个页面 content: "@Url.Action("Detial", "UserInfo")?id="+id
    //});


    //tips层
    //layer.tips('Hi我是tips', '#btn'); //第二个参数是吸附元素选择器,如#id

    //iframe层
    //layer.open({
    // type: 2,
    // title: 'layer mobile页',
    // shadeClose: true,
    // shade: 0.8,
    // area: ['70%', '90%'],//宽 高
    // content: 'text.html'
    //});


    ////加载层-默认风格
    //layer.load();
    ////此处演示关闭
    //setTimeout(function () {
    // layer.closeAll('loading');
    // layer.msg("关闭了");
    //}, 2000);

    //小tips
    //layer.tips('我是另外一个tips,只不过我长得跟之前那位稍有些不一样。', '吸附元素选择器', {
    // tips: [1, '#3595CC'],
    // time: 4000
    //});


    //prompt层
    //layer.prompt({ title: '输入任何口令,并确认', formType: 1 }, function (pass, index) {
    // layer.close(index);
    // layer.prompt({ title: '随便写点啥,并确认', formType: 2 }, function (text, index) {
    // layer.close(index);
    // layer.msg('演示完毕!您的口令:' + pass + '<br>您最后写下了:' + text);
    // });
    //});


    //tab层
    //layer.tab({
    // area: ['600px', '300px'],
    // tab: [{
    // title: 'TAB1',
    // content: '内容1'
    // }, {
    // title: 'TAB2',
    // content: '内容2'
    // }, {
    // title: 'TAB3',
    // content: '内容3'
    // }]
    //});


    //相册层
    //$.getJSON('test/photos.json?v=' + new Date, function (json) {
    // layer.photos({
    // photos: json //格式见API文档手册页
    // , anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机
    // });
    //});

    </script>

  • 相关阅读:
    【数组】Unique Paths II
    【数组】Unique Paths
    【数组】word search
    购物网站布局实战
    Javascript显示和隐式类型转换
    JS检测数据类型
    从setTimeout谈js运行机制
    0.1 + 0.2 = 0.30000000000000004怎样理解
    (译)详解javascript立即执行函数表达式(IIFE)
    Redis
  • 原文地址:https://www.cnblogs.com/bin521/p/8340062.html
Copyright © 2020-2023  润新知