找一个等效的jQuery

时间:2017-07-26 16:33:39

标签: javascript jquery resize window-resize

我正在使用这段代码在折叠和展开搜索面板时刷新/调整主窗口的大小。这目前适用于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'),但在折叠和展开搜索面板时这不起作用。

任何想法都会很棒。 非常感谢。

1 个答案:

答案 0 :(得分:0)

你可以jQuery trigger

&#13;
&#13;
// 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;
&#13;
&#13;