防止easyui的panel/window/dialog组件超出浏览器边境

最新推荐文章于 2019-12-06 11:34:44 发布

E01014165

最新推荐文章于 2019-12-06 11:34:44 发布

阅读量1.1k

点赞数

文章标签： easyui

本文介绍了一个用于 EasyUI 的自定义函数 easyuiPanelOnMove，该函数可以确保 EasyUI 中的 panel、window 和 dialog 组件不会超出浏览器边界。通过调整组件的位置，使其始终保持在可视区域内。

摘要由CSDN通过智能技术生成

/** * @author 孙宇 * * @requires jQuery,EasyUI * * 防止panel/window/dialog组件超出浏览器边界 * @param left * @param top */ var easyuiPanelOnMove = function(left, top) { var l = left; var t = top; if (l < 1) { l = 1; } if (t < 1) { t = 1; } var width = parseInt($(this).parent().css('width')) + 14; var height = parseInt($(this).parent().css('height')) + 14; var right = l + width; var buttom = t + height; var browserWidth = $(window).width(); var browserHeight = $(window).height(); if (right > browserWidth) { l = browserWidth - width; } if (buttom > browserHeight) { t = browserHeight - height; } $(this).parent().css({/* 修正面板位置 */ left : l, top : t }); }; $.fn.dialog.defaults.onMove = easyuiPanelOnMove; $.fn.window.defaults.onMove = easyuiPanelOnMove; $.fn.panel.defaults.onMove = easyuiPanelOnMove;

　　将代码放到easyui.min.js后面就行