简体   繁体   English

突然,JavaScript / jQuery停止工作

[英]Suddenly JavaScript/jQuery stopped working

My site was working extremely fine with jQuery Ui and all but suddenly I changed a color and it stopped! 我的网站与jQuery Ui的配合使用非常好,但是突然我改变了颜色,然后停止了! Any hints why this happened? 有什么提示为什么会这样吗? I tried writing the JavaScript in the HTML file itself as well as linking as a separate .js file. 我尝试在HTML文件本身中编写JavaScript以及链接为单独的.js文件。 Both did not seem to work. 两者似乎都不起作用。

MY HTML : 我的HTML:

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>Spree 2014 | BITS - Pilani, K. K. Birla Goa Campus Sports Festival</title>

    <link rel="stylesheet" type="text/css" href="teaser.css" />
    <LINK REL="SHORTCUT ICON" HREF="http://s9.postimg.org/jtx29pdbf/bits.png" />

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
    <script type="text/javascript" src="teaser.js"></script>

</head>

<body>
    <div id="sidebar">
        <img src = "images/arrow.png" alt = "Click to open" id = "arrow">
    </div>

        <div id ="gallery" class = "hidden"><div class="text">Gallery</div></div>
        <div id = "lookback" class = "hidden"><div class="text">Lookback</div></div>
        <div id = "timer" class = "hidden"><div class="text">Timer</div></div>

    <div id="social">
        <a href="https://www.facebook.com/bitsspree?fref=ts"><img src="images/fb.png" alt = "Contact us on Facebook" id = "fb"></a>
        <a href="https://twitter.com/bitsspree"><img src="images/twitter.png" alt = "Stay tuned on twitter" id = "twitter"></a>
    </div>

    <div id="tabs">
            <ul>
                <li><a href="">About</a></li>
                <li><a href="">Sponsors</a></li>
                <li><a href="">Contact</a></li>
                <li><a href="">Subscribe</a></li>
            </ul>
    </div>
    <div>

    <div id="logo">
        <img src="images/spreelogo.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
    </div>

    <div id="bits">
        <img src="images/bits.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
    </div>

    <div id="man">
        <img src="images/runningman.png" alt="Spree Pure Sport | Run | Rise | Reach"></img>
    </div>
</body>

MY JS FILE: 我的JS文件:

$(document).ready(function(){
    $("#bits").hide();
    $("#lookback").hide();
    $("#timer").hide();
    $("#arrow").click(function(){
        $("#sidebar").hide();
        $("#gallery").show( "fold", 2000 );
        $("#lookback").show( "fold", 2000 );
        $("#timer").show( "fold", 2000 );
    });
});

Problems like this can generally be easily solved using developer tools in the browser. 使用浏览器中的开发人员工具通常可以轻松解决此类问题。 My favorite is Firebug in Firefox, but each of the modern browsers has the capabilities you need. 我最喜欢的是Firefox中的Firebug,但是每种现代浏览器都具有您所需的功能。

This is likely caused by either a file not being found, or a JavaScript error. 这可能是由于找不到文件或JavaScript错误引起的。 Enable debugging and load your page. 启用调试并加载页面。 Look at the network record for a 404, and at the console for a JS error. 在网络记录中查找404,在控制台中查找JS错误。 You can also examine your HTML to see if the DOM model is as you expect it to be. 您还可以检查HTML以查看DOM模型是否符合您的预期。 You can set a break point in your script to see if the code is being reached -- if not work your way backwards up the call stack to see where the logic is wrong, and step through the code. 您可以在脚本中设置一个断点,以查看是否已到达代码-如果不成功,则可以沿调用堆栈向后向上查看逻辑错误的地方,然后逐步执行代码。

If you can practice these skills, you can solve the vast majority of your bugs without needing help from others. 如果您可以练习这些技能,则无需其他人的帮助即可解决绝大多数错误。

Your script tag importing jquery is missing an "http:" before the URL. 您的脚本标签导入jquery在URL之前缺少“ http:”。 That would break your Jquery-ui. 那会破坏您的Jquery-ui。

Change it to: 更改为:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

The code seems fine. 该代码似乎很好。 Check your links properly; 正确检查您的链接; also if they are accessible from your browser. 也可以通过浏览器访问它们。

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
    <script type="text/javascript" src="teaser.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM