zoukankan      html  css  js  c++  java
  • 解决jqueryeasyUI dialog 弹出窗体超出浏览器,导致不能关闭的bug

    使用panel的onMove事件攻克了panel,dialog以及window组件在被拖动时,会超出浏览器边界而无法拖回的情况。

    当窗体被拖出浏览器有边界时。$(document).width();会增大,增大的部分就是窗体超过浏览器窗体的部分,所以right > browserWidth条件永远无法满足。

    假设我们在思考得多一点,事实上对于panel,dialog,window三个组件,我们往往要求的并非它不能超出浏览器界限。而是要求它不能超出父元素界限,并且当父元素的overflow不是hidden的时候。应该同意组件超出父元素右下側,个人认为这样更合理。

    真的这个bug,所以终于的代码改为下面形式较为合理:



    /**

     * add by cgh

     * 针对panel window dialog三个组件拖动时会超出父级的元素中的修正

     * 假设父级的元素中的overflow属性为hidden,则修复上下左右个方向

     * 假设父级的元素中的overflow属性为非hidden,则仅仅修复上左两个方向

     * @param left

     * @param top

     * @returns

     */

    var easyuiPanelOnMove = function(left, top) {
    var parentObj = $(this).panel('panel').parent();
    if (left < 0) {
    $(this).window('move', {
    left : 1
    });
    }
    if (top < 0) {
    $(this).window('move', {
    top : 1
    });
    }
    var width = $(this).panel('options').width;
    var height = $(this).panel('options').height;
    var right = left + width;
    var buttom = top + height;
    var parentWidth = parentObj.width();
    var parentHeight = parentObj.height();
    if(parentObj.css("overflow")=="hidden"){
    if(left > parentWidth-width){
    $(this).window('move', {
    "left":parentWidth-width
    });
    }
    if(top > parentHeight-height){
    $(this).window('move', {
    "top":parentHeight-height
    });
    }
    }
    };
    $.fn.panel.defaults.onMove = easyuiPanelOnMove;
    $.fn.window.defaults.onMove = easyuiPanelOnMove;
    $.fn.dialog.defaults.onMove = easyuiPanelOnMove;

    将js代码保存为js文件,在jquery.easyui.min.js之后引入你保存的js文件就可以。


    百度博客搬家:源地址:http://hi.baidu.com/confidence68/item/0f10ab18ad5a96c638cb304c

  • 相关阅读:
    洛谷 P4001 [ICPC-Beijing 2006]狼抓兔子
    杂题20201201
    杂题20210103
    杂题20201010
    杂题20200928
    ACL1 Contest 1 简要题解
    杂题20200906
    杂题20200623
    USACO2020DEC Gold/Platinum 解题报告
    CSP-S2020游记
  • 原文地址:https://www.cnblogs.com/mqxnongmin/p/10499689.html
Copyright © 2011-2022 走看看