zoukankan      html  css  js  c++  java
  • 一个pop弹窗

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <title>Document</title>
    </head>
    <body>
    <script type="text/javascript">
    <!--
    function ($) {
    // debugger;

    var Pop = function (opt) {
    this.default_opt = {
    type: 'alert',
    title: '提示信息',
    content: '这是提示信息',
    callback: null,
    callback_1: null,
    callback_2: null
    };
    this.opt = $.extend({}, this.default_opt, opt);
    this.root = null;
    this.template = '<div class="xw-mask"><div class="xw-pop-cont"><div class="xw-pop-body"><p class="xw-pop-title">{{title}}</p><p class="xw-pop-content">{{content}}</p></div><div class="xw-pop-foot">{{type}}</div></div></div>';
    this.alert = '<div class="xw-pop-btn alert-btn">好</div>';
    this.confirm = '<div class="xw-pop-btn confirm-btn confirm-btn-1">取消</div><div class="xw-pop-btn confirm-btn confirm-btn-2">确定</div>';
    }

    Pop.prototype = {
    init: function () {
    this.create();
    this.bind(this.opt);
    },

    create: function () {
    this.root = $(this.html(this.opt)).appendTo('body');
    },

    html: function (opt) {
    return this.template.replace('{{title}}', opt.title).replace('{{content}}', opt.content).replace('{{type}}', this[opt.type]);
    },

    bind: function (opt) {
    var self = this;
    self.root.find('.xw-pop-btn').on('click', function () {
    if(opt.type == 'alert' && opt.callback)
    opt.callback();
    else if($(this).hasClass('confirm-btn-1') && opt.callback_1)
    opt.callback_1();
    else if($(this).hasClass('confirm-btn-2') && opt.callback_2)
    opt.callback_2();

    self.root.remove();
    self.root = null;
    });
    }
    }

    $.pop = function (opts) {
    var pop = new Pop(opts);
    pop.init();
    }
    })($);

    //-->
    </script>
    </body>
    </html>

  • 相关阅读:
    Tensorflow2.0基础
    Tensorflow2.0多层感知机实现mnist手写数字识别
    numpy数组的维度操作和axis的对应关系
    jupyter notebook使用
    darknet批量测试并保存图片
    darknet训练自身数据集的小问题
    PIL批量更改图片格式 及bat/cmd文件批量修改文件后缀名
    cv::Mat用法
    VS配置opencv、cuda及调用yolo动态链接库
    VS之 32 or 64
  • 原文地址:https://www.cnblogs.com/zhouzhou163/p/6100478.html
Copyright © 2011-2022 走看看