jQuery窗口调整大小不会触发

Question

The question is really bored but i haven't handle it. I need to call an object method when window resized. The code is as shown below

    var ThemeDesignerHelper = new function () {
        this.initialize = function () {
            debugger;
            var self = this;
            $(document).ready(function () {

                $(window).resize(function () {
                    alert("res");
                });
            });

        }
        this.initialize();
}

Jquery doesn't fire alert when i resized window. I think this is not about jquery or my browser version because when i tried the above code on jsfiddle it works perfectly. Why does not above code work? Anyone have any opinion to share with me.

Note: When i change window to document it works!

Answer 1

If you must solve this problem immediately you can use javascript window event listener as below

$(document).ready(function () {
            if (window.addEventListener) {
                window.addEventListener("resize", function(){alert("res")}, false);
            } else if (object.attachEvent) {
                object.attachEvent("on" + "resize", function(){alert("res")});
            } else {
                console.error("unknown event listener object.");
            }
        });

Answer 2

For JQuery, the correct syntax on a window resize is:

$(window).on('resize', function(){
   //Do something
});

Answer 3

Try this

$(window).resize(function() {
   $('body').prepend('<div>' + $(window).width() + '</div>');
 });