我正在使用这段代码在折叠和展开搜索面板时刷新/调整主窗口的大小。这目前适用于Chrome,IE 11和Edge,但我担心这会因其他浏览器而失败。
所以在我的index.html文件中,我添加了这里我将refreshWindow()添加到<div>
元素的ng-click上。
<div class="cg-master-main-wrapper">
<!-- slide left/expand sidebar -->
<div class="cg-master-toggle-bar" ng-if="sidebar.left && sidebar.collapsible" ng-click="sidebar.hidden=!sidebar.hidden; refreshWindow()" ng-class="{'closed':sidebar.hidden, 'open':!sidebar.hidden}">
<button class="cg-toggle-arrow" type="button">
<span class="icon icon-1-75x" ng-class="{'icon-chevron-right':sidebar.hidden, 'icon-chevron-left':!sidebar.hidden}"></span>
</button>
</div>
<!-- main Content -->
. . Other code . .
</div>
在我的cgSessionController.js文件中,我创建了refreshWindow()函数
angular.module("cgCore").controller("cgSessionController", ["$scope", "$location", "$log", "$q", "$window", "$rootScope", "Idle", "Keepalive", "cgSessionService", "cgGlobals", "$timeout", "cgNavigationService", "cgBoHelper",
function ($scope, $location, $log, $q, $window, $rootScope, Idle, Keepalive, cgSessionService, cgGlobals, $timeout, cgNavigationService, cgBoHelper)
{
. .Some Code. .
$scope.refreshWindow = function () {
$timeout(function () {
var evt = document.createEvent('HTMLEvents');
evt.initEvent('resize', true, true);
window.dispatchEvent(evt);
});
}
. . Some More Code. .
}]);
如何使用jQuery产生相同的结果?
我尝试使用$(window).trigger('resize')
,但在折叠和展开搜索面板时这不起作用。
任何想法都会很棒。 非常感谢。
答案 0 :(得分:0)
// Listen to resize
$( window ).resize(function() {
console.log('resize')
})
// Fire resize event manually, also you can resize the window to trigger the event!
var e = jQuery.Event( "resize" );
jQuery( window ).trigger( e );
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;