Javascript和jquery在jsfiddle上正常工作但不在本地工作

时间:2014-11-17 15:25:52

标签: javascript jquery html

我的html,css和jquery在jsfiddle http://jsfiddle.net/mwjqpqra/4/完全正常工作

<!DOCTYPE HTML>
<html>
<head>



    <title>World Wide Web</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="java.js"></script>
    <div id="header">
        <div>
            <div class="logo">
                <a href="#index">Profect WWW</a>
            </div>
            <ul id="navigation">
                <li class="active">
                    <a href="#index">What</a>
                </li>
                <li>
                    <a href="#who">Who</a>
                </li>
                <li>
                    <a href="#how">How</a>
                </li>
                <li>
                    <a href="#when">When</a>
                </li>
                <li>
                    <a href="#awesome">Awesome!</a>
                </li>
            </ul>
        </div>
    </div>
    <div id="adbox">
        <div class="clearfix">
            <img src="images/box.png" alt="Img" height="342" width="368">
            <div>
                <h1>WW What?</h1>
                <h2>Project World Wide Web.</h2>
                <p>
                    The World Wide Web (abbreviated as WWW or W3, commonly known as the Web) is a system of interlinked hypertext documents that are accessed via the Internet. With a web browser, one can view web pages that may contain text, images, videos, and other multimedia and navigate between them via hyperlinks. <span><a href="index.html" class="btn">Explore!</a><b>Don’t worry it’s for free</b></span>
                </p>
            </div>
        </div>
    </div>
    <div id="contents">
        <div id="tagline" class="clearfix">
            <h1 id="whomade">Who made it ? O.o</h1>
            <section id="who">
            <div>
                <p>
                    Tim Berners-Lee, a British computer scientist and former CERN employee,and Belgian computer scientist Robert Cailliau are considered the inventors of the Web. 
                </p>
                <p>
                    On March 12, 1989, Berners-Lee wrote a proposal for what would eventually become the World Wide Web.</p>
                <p>
                    The 1989 proposal was meant for a more effective CERN communication system but Berners-Lee eventually realised the concept could be implemented throughout the world.
                </p>
            </div>
            <div>
                <p>
                    Berners-Lee and Belgian computer scientist Robert Cailliau proposed in 1990 to use hypertext "to link and access information of various kinds as a web of nodes in which the user can browse at will",and Berners-Lee finished the first website in December of that year.
                </p>
                <p>
                    The first test was completed around 20 December 1990 and Berners-Lee reported about the project on the newsgroup alt.hypertext on 7 August 1991.
                </p>
                <p>
                    Wix is an online website builder with a simple drag & drop interface, meaning you do the work online and instantly publish to the web.
                </p>
            </div>
        </section>
        </div>
        <div id="slider-wrapper">
        <div class="inner-wrapper">
            <input checked type="radio" name="slide" class="control" id="Slide1"/>
                <label for="Slide1" id="s1"></label>
            <input type="radio" name="slide" class="control" id="Slide2"/>
                <label for="Slide2" id="s2"></label>
            <input type="radio" name="slide" class="control" id="Slide3"/>
                <label for="Slide3" id="s3"></label>
            <input type="radio" name="slide" class="control" id="Slide4"/>
                <label for="Slide4" id="s4"></label>
            <div class="overflow-wrapper">
                <a class="slide" href=""><img src="http://i.imgur.com/hKju1EC.jpg"/></a>
                <a class="slide" href=""><img src="http://i.imgur.com/hKju1EC.jpg"/></a>
                <a class="slide" href=""><img src="http://i.imgur.com/hKju1EC.jpg"/></a>
                <a class="slide" href=""><img src="http://i.imgur.com/hKju1EC.jpg"/></a>
            </div>
        </div>

    </div>
    </div>
    <div id="footer">
        <div class="clearfix">
            <div id="connect">
                <a href="http://freewebsitetemplates.com/go/facebook/" target="_blank" class="facebook"></a><a href="http://freewebsitetemplates.com/go/googleplus/" target="_blank" class="googleplus"></a><a href="http://freewebsitetemplates.com/go/twitter/" target="_blank" class="twitter"></a><a href="http://www.freewebsitetemplates.com/misc/contact/" target="_blank" class="tumbler"></a>
            </div>
            <p>
                © 2025 Dark Virtuality.
            </p>
        </div>
    </div>
</body>
</html>

Java.js

$(document).ready(function(){
 $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash;
        $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

但网页似乎甚至没有拿起.js代码,jquery和java.js在我的电脑上无法在本地运行。我已经尝试过不同的浏览器,比如chrome,firefox开发者版,甚至IE,但没有运气

1 个答案:

答案 0 :(得分:3)

问题显然是

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

因为您在本地运行它,//不会链接到您希望它链接的位置。您需要手动使用http:https:

所以...使用

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

如果它适用于JSFiddle但不适用于您的本地主机,那就是问题所在。

我没有准备好你的任何代码,因为我发现了这一点。

如果您想

,请详细了解here