javascript $(window).width() 和 $(window).height() 返回 NULL -JQuery

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5452946/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 17:14:59  来源:igfitidea点击:

$(window).width() and $(window).height() return NULL -JQuery

javascriptjquery

提问by user589533

I want to get the size of browser window using $(window).width()and $(window).height()functions. However this two return null. the $(window)is not null, it's returning "object". I have tried also using $(document).width()and $(document).height(), this two do not return null, they are returning specific values, but they are bigger than the window size. Any idea why the $window2 values are null?

我想使用$(window).width()$(window).height()功能获取浏览器窗口的大小。然而这两个返回空值。在$(window)不为空,它返回“对象”。我也尝试过使用$(document).width()and $(document).height(),这两个不返回空值,它们返回特定值,但它们大于窗口大小。知道为什么这$window两个值为空吗?

$(window).load(function () {

            var view = $("#view");
            var image = $("#image");
            var hiResImage = $("#hi-res-image"); 
            var zoom = $("<a id='zoom'><span><br /></span></a>");
            log("ERROR 1 = " + $(window).width());
            log("ERROR 1 = " + $(window).height());
            log("ERROR 1 = " + $(window));
            image.width($(window).width());
            image.height($(window).height());

.....

.....

Should I initialize somw how the $(window) variable?

我应该如何初始化 $(window) 变量?

回答by jon_darkstar

Just like commenters, I'm not sure why that doesn't work, but this can be done in vanilla JS and the window object without jQuery so you might have better luck with that. Could circumvent some issues with jQuery versions, browser compatability, etc

就像评论者一样,我不确定为什么这不起作用,但是这可以在 vanilla JS 和不使用 jQuery 的 window 对象中完成,所以你可能会有更好的运气。可以绕过 jQuery 版本、浏览器兼容性等方面的一些问题

window.innerWidth   //just the actual document window
window.innerHeight
window.outerWidth   //includes brother toolbars, status bar, etc
window.outerHeight

I'd still recommend you investigate why what you oroginally tried isnt working, bc whatever the root problem is it will probably manifest itself again elsewhere.

我仍然建议您调查为什么您最初尝试的方法不起作用,因为无论根本问题是什么,它都可能会在其他地方再次出现。

回答by tobias86

I played around on the console in Google Chrome and the following works for me:

我在谷歌浏览器的控制台上玩过,以下对我有用:

$(window).attr('screen').height

and

$(window).attr('screen').width

EDIT: See jon_darkstar's answer. The $(window)function is a jQuery selector which returns a DOM element. In order to access the properties of the object you need to use the .attr()method. I tend to agree with jon_darkstar, Occam's Razor dictates that vanilla JS is most probably the best way to go, and thus gets my vote. But if you reallywant to use jQuery, the above will work.

编辑:见 jon_darkstar 的回答。该$(window)函数是一个 jQuery 选择器,它返回一个 DOM 元素。为了访问对象的属性,您需要使用该.attr()方法。我倾向于同意 jon_darkstar,Occam's Razor 表明 vanilla JS 很可能是最好的方法,因此得到了我的投票。但是如果你真的想使用 jQuery,上面的方法就行了。