2009-04-29 5 views
0

J'essaie de faire un simple tutoriel jQuery, mais cela ne fonctionnera pas.Le tutoriel jQuery simple ne fonctionnera pas

<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> 

J'ai copié et collé le nom du fichier jquery: jquery-1.3.2

Je ne vois pas ce qui ne va pas? J'utilise Firefox.

+0

Dites-nous ce qui se passe. Rien? Des erreurs du navigateur? Quelque chose d'inexplicable? –

Répondre

3

Vous devez être très prudent avec l'endroit où vous mettez les différentes parties du code pour que cela fonctionne. Jetez un oeil à ce code qui a fonctionné pour moi.

<!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> 
+0

hmmm c'est intéressant, vous avez les balises de script dans le corps de la doc. Merci ça marche. – Ankur

+0

L'emplacement de vos tags SCRIPT dépend de vous. Dans mon code, vous pouvez les mettre dans la tête et cela fonctionnera toujours. Il dicte juste quand vous commencez à voir votre page. Tout dans le HEAD est chargé avant que la page commence à dessiner. Dans votre code, vous avez également essayé de créer un lien vers un fichier externe dans le tag SCRIPT * et * de fournir un code qui n'est pas possible. –

9

Premièrement, assurez-vous d'avoir le jquery-1.3.2.js dans votre répertoire.

Ensuite, modifiez vos balises de script:

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

Mettez votre clic code d'événement dans différents bloc de script.

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

L'erreur que vous avez commis me rappelle de Degrading Script Tags

balises de script qui font référence à des ressources externes (via l'attribut src) ne sont plus en mesure d'exécuter le script intégré dans la balise elle-même.

Questions connexes