Простое руководство по jQuery не будет работать - PullRequest
0 голосов
/ 29 апреля 2009

Я пытаюсь сделать простое руководство по jQuery, но оно не будет работать.

<html>                                                                  
 <head>                    
    <title></title>
    <script type="text/javascript" src="jquery-1.3.2.js">                                         
        $(function() {
            $('a').click(function() {
            $('#box').fadeOut();
        });
    });                                    
</script>           
<style type="text/css">
        #box
    {   background: red;
        width: 300px;
        height: 300px;
    }
</style>

</head>                                                                 
<body>                                
    <div id="box" ></div>
        <a href="#">Click Me</a>

</body>                                                                    
</html>

Я скопировал и вставил имя файла jquery: jquery-1.3.2

Я не вижу, что не так? Я использую Firefox.

Ответы [ 3 ]

15 голосов
/ 29 апреля 2009

Поместите код события клика в другой блок скрипта.

    <script type="text/javascript" src="jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(function() {
            $('a').click(function() {
                    $('#box').fadeOut();
            });
    }); 
    </script>

Ошибка, которую вы совершили, помнит меня Унижающие теги сценария

Теги скрипта, которые ссылаются на внешние ресурсы (через атрибут src), больше не могут выполнять скрипт, встроенный в сам тег.

9 голосов
/ 29 апреля 2009

Сначала убедитесь, что в вашем каталоге есть jquery-1.3.2.js.

Затем измените теги скрипта:

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
            $('a').click(function() {
                    $('#box').fadeOut();
            });
    });
</script>
3 голосов
/ 29 апреля 2009

Вы должны быть очень осторожны с тем, куда вы помещаете различные части кода, чтобы он работал.

Посмотрите на этот код, который работал для меня.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <title>Fade Out Red Box</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <style type="text/css">
  #box
  {
    background: red;
    width: 300px;
    height: 300px;
  }
  </style>
</head>

<body>
  <div id="box"></div>
  <a href="#">Click me</a>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

  <script type="text/javascript">
    $(document).ready(function(){
      $("a").click(function() {
        $("#box").fadeOut("slow");
      });
    });
  </script>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...