JavaScript Uncaught ReferenceError: jQuery n'est pas défini; Uncaught ReferenceError: $ n'est pas défini [dupliquer]
cette question a déjà une réponse ici:
- Uncaught ReferenceError: $ n'est pas défini? 33 réponses
C'est mon violon, http://jsfiddle.net/4vaxE/35 /
ça marche très bien dans mon violon.
cependant, quand je le transfère à dreamweaver, ça ne peut pas marcher. Et j'ai trouvé ces deux erreurs dans mon codage.
- Uncaught ReferenceError: jQuery n'est pas défini
- uncaught referenceerror $ n'est pas défini
j'avais lu avant l'article lié à ces deux erreurs, et essayé de résoudre selon la méthode fournie, cependant, il ne fonctionne toujours pas, comment puis-je résoudre cela?
Voici mon plein codage en dreamweaver
<body>
<div class="buttons" style="background-color: rgba(0,0,0,.8);">
<a class="button" id="showdiv1">Div 1</a>
<a class="button" id="showdiv2">Div 2</a>
<a class="button" id="showdiv3">Div 3</a>
<a class="button" id="showdiv4">Div 4</a>
</div>
<div id="div1">1</div>
<div id="div2">2</div>
<div id="div3">3</div>
<div id="div4">4</div>
</div>
<script language="JavaScript" type="text/javascript" script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
<script language="JavaScript" type="text/javascript">
var selectedEffect="explode";
var options = { percent: 100 };
$('#showdiv1').click(function () {
$('div[id^=div]').hide();
$('#div1').show( selectedEffect, options, 500, callback );
});
$('#showdiv2').click(function () {
$('div[id^=div]').hide();
$('#div2').show( selectedEffect, options, 500, callback );
});
$('#showdiv3').click(function () {
$('div[id^=div]').hide();
$('#div3').show( selectedEffect, options, 500, callback );
});
$('#showdiv4').click(function () {
$('div[id^=div]').hide();
$('#div4').show( selectedEffect, options, 500, callback );
});
function callback() {
setTimeout(function() {
$( "#effect:visible" ).removeAttr( "style" ).fadeOut();
}, 1000 );
};
</script>
</body>
</html>
CSS
<style type="text/css">
.button {
cursor:pointer;
display:inline-block;
margin:10px;
clip: rect(auto,auto,auto,auto);
}
#div1 {
background:aqua;
padding:20px;
width:100px;
text-align:center;
display:none;
}
#div2 {
background:blue;
padding:20px;
width:100px;
text-align:center;
display:none;
}
#div3 {
background:orange;
padding:20px;
width:100px;
text-align:center;
display:none;
}
#div4 {
background:green;
padding:20px;
width:100px;
text-align:center;
display:none;
}
a {
color:aqua;
-webkit-filter: grayscale(1.0);
}
a:hover {
color:red;
-webkit-filter: grayscale(0.0);
}
</style>
3 réponses
Cause Vous devez ajouter bibliothèque jQuery à votre fichier:
jQuery UI est juste un addon pour jQuery , ce qui signifie que
tout d'abord, vous devez inclure le jQuery bibliothèque → et ensuite le UI .
<script src="path/to/your/jquery.min.js"></script>
<script src="path/to/your/jquery.ui.min.js"></script>
vous n'incluez pas la bibliothèque jquery. À jsfiddle il est déjà là. Il suffit d'inclure cette ligne dans votre tête section.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
vous avez une erreur dans la construction de l'étiquette de script, ceci:
<script language="JavaScript" type="text/javascript" script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
devrait ressembler à ceci:
<script language="JavaScript" type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
vous avez un mot' script ' perdu au milieu de votre étiquette de script. Vous devez également supprimer le http: / / pour laisser au navigateur le choix D'utiliser HTTP ou HTTPS.
mise à JOUR
mais votre erreur principale est que vous incluez jQuery UI (seulement) vous devez incluez jQuery d'abord! jQuery UI et jQuery sont utilisés ensemble, pas séparément. jQuery UI dépend de jQuery. Vous devez mettre cette ligne avant jQuery UI:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>