Question

当我尝试

时

$(document).ready(function() { alert("TEST");});

当我尝试

时没有任何反应

$(window).load(function() { alert("TEST");});

一切正常。由于load()工作意味着我的jQuery文件引用是正确的。

所以任何人都可以告诉我为什么这不起作用？

我的HTML标记是：

<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/general_styles.css">
    <title></title>
</head>
<body>
    <div id="container">
        <div id="header">
            <img src="img/loginlogo.png"/>
            <h1>PRINSEAPALS</h1>
            <h3>MARINE SERVICES</h3>
            <p>"We deeply believe in the common good of all involved in making ships safer and seas cleaner."</p>
        </div>
            <ul id="menu">
                <li><a href="#">Home</a></li>
                <li>
                    <a href="#">Services</a>
                    <ul>
                        <li><a href="#">Fire Extinguishers</a></li>
                        <li><a href="#">Immersion Suits</a></li>
                        <li><a href="#">Breathing Apparatus</a></li>
                        <li><a href="#">Liferafts</a></li>
                        <li><a href="#">Lifeboats</a></li>
                        <li><a href="#">Fixed CO<sub>2</sub> Systems</a></li>
                        <li><a href="#">Foam Analysis</a></li>
                    </ul>
                </li>
                <li><a href="#">About Us</a></li>
                <li><a href="#">Contact Us</a></li>
            </ul>
        <div id="slider">   
            <img id="img1" src="img/fire-extinguishers.jpg" />
            <img id="img2" src="img/immersion-suit.jpg">
            <img id="img3" src="img/breathing-apparatus.jpg">
            <img id="img4" src="img/liferaft.jpg">
            <img id="img5" src="img/lifeboat.jpg">
            <img id="img6" src="img/fixed-co2.jpg">
            <img id="img7" src="img/foam analysis.jpg">
        </div>
        <footer>
            <ul>
                <li><a href="#">Lifeboats</a></li>
                <li><a href="#">Lifeboats</a></li>
                <li><a href="#">Lifeboats</a></li>
            </ul>
        </footer>
    </div>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/slider.js"></script>
</body>
</html>

更新：介于

之间

<script type="text/javascript" src="js/jquery.js"></script>

和

<script type="text/javascript" src="js/slider.js"></script>

我有另一个档案：

<script type="text/javascript" src="js/IE6.js"></script>

包含：

$(function() {
  if ($.browser.msie && $.browser.version.substr(0,1)<7)
  {
    $('li').has('ul').mouseover(function(){
        $(this).children('ul').css('visibility','visible');
        }).mouseout(function(){
        $(this).children('ul').css('visibility','hidden');
        })
  }
});

根据我的Firefox网络控制台，我收到以下2个错误：

错误： http://example.com/js/jquery.js正在分配//＃sourceMappingURL，但已经有一个

TypeError： $ .browser未定义

当我删除文件.ready()之间的工作时。

Answer 1

$(document).ready(function() {
    // executes when HTML-Document is loaded and DOM is ready
    alert("document is ready");
});

$(window).load(function() {
    // executes when complete page is fully loaded, including all frames, objects and images
    alert("window is loaded");
});

当然，如果您调用位于结束</body>标记旁边的函数，则与使用$(document).ready(function(){});部分中的<head>相同。

Answer 2

试试这个......这可能有用。

<html>

<script>
    $(document).ready(function() { alert("TEST");}); 
</script>
</head>
<body>
<div id="container">
    <div id="header">
        <img src="img/loginlogo.png"/>
        <h1>PRINSEAPALS</h1>
        <h3>MARINE SERVICES</h3>
        <p>"We deeply believe in the common good of all involved in making ships safer and seas cleaner."</p>
    </div>
        <ul id="menu">
            <li><a href="#">Home</a></li>
            <li>
                <a href="#">Services</a>
                <ul>
                    <li><a href="#">Fire Extinguishers</a></li>
                    <li><a href="#">Immersion Suits</a></li>
                    <li><a href="#">Breathing Apparatus</a></li>
                    <li><a href="#">Liferafts</a></li>
                    <li><a href="#">Lifeboats</a></li>
                    <li><a href="#">Fixed CO<sub>2</sub> Systems</a></li>
                    <li><a href="#">Foam Analysis</a></li>
                </ul>
            </li>
            <li><a href="#">About Us</a></li>
            <li><a href="#">Contact Us</a></li>
        </ul>
    <div id="slider">   
        <img id="img1" src="img/fire-extinguishers.jpg" />
        <img id="img2" src="img/immersion-suit.jpg">
        <img id="img3" src="img/breathing-apparatus.jpg">
        <img id="img4" src="img/liferaft.jpg">
        <img id="img5" src="img/lifeboat.jpg">
        <img id="img6" src="img/fixed-co2.jpg">
        <img id="img7" src="img/foam analysis.jpg">
    </div>
    <footer>
        <ul>
            <li><a href="#">Lifeboats</a></li>
            <li><a href="#">Lifeboats</a></li>
            <li><a href="#">Lifeboats</a></li>
        </ul>
    </footer>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/slider.js"></script>
</body>
</html>

为什么jQuery ready事件处理程序不起作用？

2 个答案: