layui 框架弹出一个界面弹框

学习文档:https://www.layui.com/

1:先引入需要的相关的文件

<script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<!-- 弹框 -->
<script src="layer/layer.js"></script>
<script src="layer/extend/layer.ext.js"></script>

2:准备一个新的页面

3:小 demo

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            #addAsset{
                width: 100px;
                height: 30px;
                line-height: 30px;
                background: #009F95;
                color: #FFFFFF;
                text-align: center;
                
                
            }
        </style>
    </head>
    
    <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
    
    <body>
        <div id="addAsset"><span>添加资产</span></div>
        
    </body>
    <!-- 弹框 -->
    <script src="layer/layer.js"></script>
    <script src="layer/extend/layer.ext.js"></script>
    
    <script>
        //添加资产
$("#addAsset").on("click", function() {
    layer.open({
        type : 2,
        title : '添加资产',
        area : [ '500px', '500px' ],
        fix : false, // �
        content : '1.html',
        end : function() {
            dataTable.reloadTable();
        }
    });
});
    </script>
</html>

实现效果:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Linyb极客之路

Mysql被黑客入侵及安全措施总结

今天登陆在腾讯云服务器上搭建的Mysql数据库,发现数据库被黑了,黑客提示十分明显。

59550
来自专栏深入浅出区块链技术

如何用Web3.jsAPI在页面中进行转账

本文介绍如何使用Web3.js API 在页面中进行转账,是我翻译的文档Web3.js 0.2x 中文版 及 区块链全栈-以太坊DAPP开发实战 中Demo的文...

17820
来自专栏吴柯的运维笔记

以太通道的配置原则

以太通道-Etherchannel -配置以太通道实现端口捆绑增加带宽和可靠性。 以太通道的作用: -多条线路负载均衡,提高带宽; -容错,当一条线路失效时,...

36740
来自专栏腾讯移动品质中心TMQ的专栏

【腾讯TMQ】Google 是如何做 Chrome 浏览器的性能测试的?

近期研究了一下chrome的强大的性能测试工具telemetry,收获颇丰,现简单介绍一下telemetry的测试框架。telemetry中的很多方法都正在逐步...

64700
来自专栏猛牛哥的博客

门罗币WINDOWS版挖矿软件缺失DLL文件下载

18930
来自专栏Netkiller

Linux 系统安全与优化配置

Linux 系统安全与优化配置 目录 1. Openssh 安全配置 1.1. 禁止root用户登录 1.2. 限制SSH验证重试次数 1.3. 禁止证书登陆 ...

38650
来自专栏黑白安全

ARP断网攻击 针对网吧

17610
来自专栏深入浅出区块链技术

详解 Solidity 事件Event - 完全搞懂事件的使用

很多同学对Solidity 中的Event有疑问,这篇文章就来详细的看看Solidity 中Event到底有什么用?

23750
来自专栏挖坑填坑

使用mpvue小程序开发问题之路由与多页面问题

1.9K20
来自专栏沈唁志

PHP开发规范之使用phpcbf脚本自动修正代码格式

在前段时间的文章:在PhpStorm中安装使用PHP_CodeSniffer编码规范检查工具中提到过phpcbf脚本

30910

扫码关注云+社区

领取腾讯云代金券