zoukankan      html  css  js  c++  java
  • 解决DWZ(JUI)的panel 点击关闭或者打开按钮 自己写的标签消失

    问题描述:
    DWZ的panel面板比较常用,我们常常需要在其标题栏上再增加一个些按钮,如下图
    问题出来了,增加按钮后,点面板收缩按钮,增加的按钮就消失了
    而且面板收缩的click事件,也跟新增的按钮绑定了,
    这样导致面板无法使用,还好是开源代码,研究其代码就能解决问题

    /**
     * @author Roger Wu
     * @version 1.0
     */
    
    function S4() {
        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
    }
    
    (function ($) {
        $.extend($.fn, {
            jPanel: function (options) {
                var op = $.extend({ header: "panelHeader", headerC: "panelHeaderContent", content: "panelContent", coll: "collapsable", exp: "expandable", footer: "panelFooter", footerC: "panelFooterContent" }, options);
                return this.each(function () {
                    var $panel = $(this);
                    var close = $panel.hasClass("close");
                    var collapse = $panel.hasClass("collapse");
    
                    var $content = $(">div", $panel).addClass(op.content);
                    var title = $(">h1", $panel).wrap('<div class="' + op.header + '"><div class="' + op.headerC + '"></div></div>');
                    var buttonid = "panel_" + S4();
                    if (collapse) $("<a id="" + buttonid + "" href=""></a>").addClass(close ? op.exp : op.coll).insertAfter(title);
    
                    var header = $(">div:first", $panel);
                    var footer = $('<div class="' + op.footer + '"><div class="' + op.footerC + '"></div></div>').appendTo($panel);
    
                    var defaultH = $panel.attr("defH") ? $panel.attr("defH") : 0;
                    var minH = $panel.attr("minH") ? $panel.attr("minH") : 0;
                    if (close)
                        $content.css({
                            height: "0px",
                            display: "none"
                        });
                    else {
                        if (defaultH > 0)
                            $content.height(defaultH + "px");
                        else if (minH > 0) {
                            $content.css("minHeight", minH + "px");
                        }
                    }
                    if (!collapse) return;
                    var $pucker = $("#" + buttonid);
                    var inH = $content.innerHeight() - 6;
                    if (minH > 0 && minH >= inH) defaultH = minH;
                    else defaultH = inH;
                    $pucker.click(function () {
                        if ($pucker.hasClass(op.exp)) {
                            $content.jBlindDown({
                                to: defaultH, call: function () {
                                    $pucker.removeClass(op.exp).addClass(op.coll);
                                    if (minH > 0) $content.css("minHeight", minH + "px");
                                }
                            });
                        } else {
                            if (minH > 0) $content.css("minHeight", "");
                            if (minH >= inH) $content.css("height", minH + "px");
                            $content.jBlindUp({
                                call: function () {
                                    $pucker.removeClass(op.coll).addClass(op.exp);
                                }
                            });
                        }
                        return false;
                    });
                });
            }
        });
    })(jQuery);
  • 相关阅读:
    Android 设置图片 Bitmap任意透明度
    Android 设置图片透明度
    Android 设置alpha值来制作透明与渐变效果的实例
    Android 仿微信朋友圈点击图片变暗
    Android 关于录音文件的编解码 实现米聊 微信一类的录音上传的功能
    Android 三种方式实现自定义圆形进度条ProgressBar
    nslookup命令
    netstat命令
    tracert与pathping
    ping命令
  • 原文地址:https://www.cnblogs.com/nele/p/5295908.html
Copyright © 2011-2022 走看看