Question

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="author" content="EJS">
        <title>Website</title>
        <link rel="stylesheet" type="text/css" href="style.css">
        <script>
            $(document).ready(function() {
                $('.html').click(function() {
                $('.html').fadeOut('fast');
                });
            });
        </script>
    </head>
    <body>
        <div id="content">
            <center>

                <nav class="navBar">
                    <a class="html" href="index.html">HTML</a> |
                    <a class="css" href="style.css">CSS</a> |
                    <a href="/js/">JavaScript</a> |
                    <a href="/jquery/">jQuery</a>
                </nav>

                <a href="http://hil.no/"><img id="hilPic" src="hil.png"></a></img>

            </center>
        </div>
    </body>
</html>

这是我的html表。为什么jQuery不工作，有什么建议吗？我尝试将jQuery放在另一个文件中然后引用它，但它仍然无法工作。

我做错了什么？

Answer 1

您的链接上有href="index.html"，因此每当您点击它时，该页面都会重定向到该index.html

如果你需要在代码下面重定向之前做一些事情应该有帮助。

$( ".html" ).click(function( event ) {
  event.preventDefault();
  // do your thing here.
});

但首先，您可能希望在脚本标记

上方的html中包含jquery

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

Answer 2

https://developers.google.com/speed/libraries/devguide#jquery

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

Answer 3

包含jquery库

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

你的代码是

$(document).ready(function() {
      $('.html').click(function(event) {
           event.preventDefault();
           $(this).fadeOut('fast');
        });
    });

Answer 4

您必须在此<head>部分中包含Jquery。

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/<your desired version>/jquery.min.js"></script>
</head>

如果不加载jQuery库，它将无法正常工作。如果要从任何其他js文件引用jquery，请确保在该js文件中包含lib。

将jQuery添加到HTML问题

4 个答案: