jQuery .hide无法在窗口加载中工作

Question

这让我发疯。 在某些时候，一切似乎都正常，但突然一切都停止了，我也不知道为什么。

我有一组div，其中一个类我想隐藏除前四个div之外的所有内容。

<div id="container">
    <div class="item">content 1</div>
    <div class="item">content 2</div>
    <div class="item">content 3</div>
    <div class="item">content 4</div>
    <div class="item">content 5</div>
</div>

我在文档的开头有以下内容

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>    
<script>
    $(window).load(function() {
        $(".item:gt(3)").hide();
    }); 
</script>

为什么不起作用？

我不得不说“ .item” div是基于URL上设置的变量动态加载的。 像mydoamin.com/myitems/?zicode=10005之类的东西

因此，显示的项目来自外部数据库并加载到页面中。

我的假设是$（window）.load等待所有这些项目存在于文档中。 我错了吗？ 在那种情况下，如何确保仅在所有内容真正加载后才执行函数？

Answer 1

您需要使用等待DOM完全加载的函数，而不是$(window).load(function() {

$(document).ready(function() {
    $(".item:gt(3)").hide();
});

演示版

Answer 2

$(window).load()与DOM ready不同。 使用此代替：

$(function () {
    $(".item:gt(3)").hide();
}

http://jsfiddle.net/murrayju/FCvCs/

Answer 3

尝试使用如下形式：

function itemHide() {
    $(".item:gt(3)").hide();
}
window.onload=itemHide;

希望这会帮助你。