admin管理员组文章数量:1316323
I have some code wrapped in $(document).ready(function(){ /*code*/ });
, and all of it works fine, except for one line. The code above it works fine, the code below it works fine, I'm not getting any errors in my console.
$('.main-right.category').height( $('.footer').height() + $('.main-right.category').height() );
That doesn't fire. However, if I paste that exactly in the developer console and press enter after the page has loaded, it works. All of the elements exist at page load (meaning none are built dynamically via javascript). Same result in chrome, firefox, IE.
Any ideas?
edit: I should add that my css is loaded before my javascript, and I've done other CSS related tweaks in this same javascript file that have worked fine.
Also, if I console.log $('.main-right.category').height() and $('.footer').height() right above that line of code, they both give non-zero integer values like I'd expect.
I have some code wrapped in $(document).ready(function(){ /*code*/ });
, and all of it works fine, except for one line. The code above it works fine, the code below it works fine, I'm not getting any errors in my console.
$('.main-right.category').height( $('.footer').height() + $('.main-right.category').height() );
That doesn't fire. However, if I paste that exactly in the developer console and press enter after the page has loaded, it works. All of the elements exist at page load (meaning none are built dynamically via javascript). Same result in chrome, firefox, IE.
Any ideas?
edit: I should add that my css is loaded before my javascript, and I've done other CSS related tweaks in this same javascript file that have worked fine.
Also, if I console.log $('.main-right.category').height() and $('.footer').height() right above that line of code, they both give non-zero integer values like I'd expect.
Share Improve this question edited Feb 21, 2012 at 20:19 LOLapalooza asked Feb 21, 2012 at 20:15 LOLapaloozaLOLapalooza 2,0823 gold badges17 silver badges22 bronze badges 3- No errors in the console? Can you post a link to the page? – James Hill Commented Feb 21, 2012 at 20:19
- 1 Without the rest of the code, the only thing I can think of is that the DOM element that you are targeting has not been loaded in the DOM at the time this statement is executed. By the time you get to the console of course its there and this statement works. – Juan Ayala Commented Feb 21, 2012 at 20:19
- Sure it does nothing? Try fixing some humongous values on the sum of heights and try. – Alfabravo Commented Feb 21, 2012 at 20:25
4 Answers
Reset to default 5The ready event fires when the DOM is ready to work with. It differs from the load event which fires when all assets (css, javascript, images, ...) are all loaded.
I guess that when you code runs, the elements you're trying to get the height does have an height calculated already so it seems nothing happens.
When you executed your code in the console, everything is loaded so the behavior is the one expected.
To bind to the load event, check the method .load().
$(document).ready fires when the DOM-structure is full available, at this time the rendering ususally isn't finished, so the dimensions of the elements may be unknown and height() will return wrong values.
Use $(window).load()
instead.
i usually set height with:
var height = $('.footer').height() + $('.main-right.category').height();
$('.main-right.category').css('height',height+'px');
You should use the console
to debug the selectors and view the heights of the elements;
$(document).ready(function() {
var $footer = $('.footer');
var $category = ('.main-right.category');
console.log($category, $footer);
console.log($category.height(), $footer.height());
console.log('New height =', ($category.height() + $footer.height()));
});
本文标签: javascriptCode won39t execute in (document)ready but will in developer consoleStack Overflow
版权声明:本文标题:javascript - Code won't execute in $(document).ready but will in developer console - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742004195a2411628.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论