JavaScript未捕获ReferenceError：未定义jQuery; Uncaught ReferenceError：$未定义

它在我的小提琴中工作正常。

但是，当我将它传输到Dreamweaver时，它无法工作。我在编码中发现了这两个错误。

未捕获的ReferenceError：未定义的jQuery
未捕获的ReferenceError $没有定义

我与此有关的两个错误之前的文章读过，并试图根据提供的方法来解决，但是，它仍然无法正常工作，我该如何解决这个问题？

这是我在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>

来源

2014-07-25 Soo

你必须加载你的jQuery UI的代码的''

您没有包含jQuery库。在jsfiddle它已经在那里。只需在头部包含这一行。

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

来源

2014-07-25 01:31:18

非常感谢〜它的工作〜 – Soo

你有你的脚本标记建设一个错误，这一点：

<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" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>

你有一个“脚本”字在中间丢失你的脚本标签。你也应该删除http：//让浏览器决定是否使用HTTP或HTTPS。

UPDATE

但你的主要错误是，你是包括jQuery用户界面（只），您必须首先包括jQuery的！ jQuery UI和jQuery一起使用，而不是单独使用。 jQuery UI依赖于jQuery。你应该把此行jQuery用户界面前：

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

来源

2014-07-25 01:31:18

额外的属性不做任何事情，协议相对的URL只是一个很好的。 – user2864740

在本地测试jQuery（即没有服务器）时，不要使用相关协议。 – j08691

@ user2864740这是一个很好的直到你使用http和更高版本的https的网站，并突然浏览器阻止你的HTTP资源（jQuery）。 –

JavaScript未捕获ReferenceError：未定义jQuery; Uncaught ReferenceError：$未定义

相关问题