JavaScript Uncaught ReferenceError:未定义jQuery; 未捕获的ReferenceError:$未定义

这是我的小提琴, http://jsfiddle.net/4vaxE/35/

它在我的小提琴中运作良好。

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

  1. 未捕获的ReferenceError:未定义jQuery
  2. 未定义的referenceerror $未定义

我之前读过有关这两个错误的文章,并尝试按照提供的方法解决,但是,它仍然无法正常工作,我该如何解决?

这是我在Dreamweaver中的完整编码

  
1
2
3
4
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 ); };

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); }  

因为您需要将jQuery库添加到您的文件中:

jQuery UI只是 jQuery的一个插件,这意味着
首先,您需要包含jQuery库→然后是UI

   

你没有包含jquery库。 在jsfiddle它已经存在。 只需在头部包含此行即可。

   

您在脚本标记构造中有错误,这:

  

应该是这样的:

  

您在脚本标记的中间丢失了“脚本”字样。 此外,您应该删除http://以让浏览器决定是使用HTTP还是HTTPS。

UPDATE

但是你的主要错误是你要包含jQuery UI(仅限)你必须首先包含jQuery! jQuery UI和jQuery一起使用,而不是单独使用。 jQuery UI依赖于jQuery。 你应该把这行放在jQuery UI之前: