简体   繁体   English

快速jQuery问题

[英]quick jQuery question

Should be a really quick one for you pro's: 对于您的专业人士来说应该是一个非常快的人:

I'm learning to use JS, in particular a plugin called (embarassingly) 'Easy Image'. 我正在学习使用JS,尤其是使用一个名为(轻松)“易图像”的插件。

http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider

Here's my code: 这是我的代码:

http://jsfiddle.net/tomperkins/LnES6/ http://jsfiddle.net/tomperkins/LnES6/

JS files are from here: http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider And obviously jQuery (1.5) JS文件来自此处: http : //cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider和jQuery(1.5)

I've stripped it down to the basics and can't figure out why it's not working. 我已经将其简化为基本知识,无法弄清为什么它不起作用。

Any tips are much appreciated! 任何提示,不胜感激!

Thanks in advance, 提前致谢,

Tom 汤姆

In menu on the left you have to set your framework to JQuery and in Add resources box add 'Easy Image' script. 在左侧菜单中,您必须将框架设置为JQuery,然后在“添加资源”框中添加“轻松图像”脚本。 Then comment out first two <script> tags (you will need them on your site but not on jsFiddle). 然后注释掉前两个<script>标记(您将需要它们在您的网站上,而不是jsFiddle上)。 Also change src attributes in <img> tags to absolute path because there is no images folder nor any images on jsFiddle site. 还要将<img>标记中的src属性更改为绝对路径,因为jsFiddle站点上没有图像文件夹也没有图像。

Edit This is what you get with <script> tags on your site: 编辑这是您在网站上通过<script>标记获得的:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
2<html><head>
3<title>500 Internal Server Error</title>
4</head><body>
5<h1>Internal Server Error</h1>
6<p>The server encountered an internal error

Script doesn't work because there are no scripts on your site (both links are dead). 脚本不起作用,因为您的站点上没有脚本(两个链接均无效)。

jquery.js and easySlider.js gets an Server error 500 when the browser tries to load them from 当浏览器尝试从中加载jquery.js和easySlider.js时,服务器错误500

http://customstudiodevelopment.co.uk/jquery-test/ http://customstudiodevelopment.co.uk/jquery-test/

Verify that the files are there and that they can be loaded 验证文件在那里并且可以加载它们

http://customstudiodevelopment.co.uk/js/jquery.js http://customstudiodevelopment.co.uk/js/jquery.js

http://customstudiodevelopment.co.uk/js/easySlider.js http://customstudiodevelopment.co.uk/js/easySlider.js

Unless both these urls load the right JS files your code will not work ... 除非这两个网址都加载了正确的JS文件,否则您的代码将无法工作...

As a general tip, get FireBug addon to firefox, with the Net panel I found this error in less than 30 seconds ;) 作为一般提示,将FireBug插件添加到firefox,在“ Net”面板中,我在不到30秒的时间内发现了此错误;)

This is working: 这正在工作:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<base href="http://customstudiodevelopment.co.uk"/>
<script type="text/javascript" src="/jquery-test/js/jquery.js"></script>
<script type="text/javascript" src="/jquery-test/js/easySlider.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("#slider").easySlider();
});
</script>
<meta charset="utf-8">
<title>jQuery Gallery Test</title>
<link href="/jquery-test/css/style.css" rel="stylesheet" type="text/css" media="all">
</head>
<body>
<div id="slider">
 <ul>
   <li><img src="/jquery-test/images/Website-Strip_Future.png"></li>
  <li><img src="/jquery-test/images/SR-Toomer_small.png"></li>
  </ul>
 </div>
<!-- /end #slider -->
</body>
</html>

Note, I put the base element in there to test on my desktop. 注意,我在其中放置了基本元素以在桌面上进行测试。 It's not required for it to work on your server, but if it's on your desktop computer, it should work (so you can copy the html into a Notepad file and save with filetype .html and run it locally to test). 它不是必须要在服务器上运行,但是如果它在台式计算机上就可以运行(因此,您可以将html复制到记事本文件中,并保存为.html文件类型,然后在本地运行以进行测试)。

It appears as if your file includes (js/css/image) are not pointing to where you want them to be. 似乎您的文件包含(js / css / image)并未指向您想要的位置。

Use Firebug to test these types of things. 使用Firebug测试这些类型的事物。 When you open the console, you can inspect the scripts included, including open each included file. 打开控制台时,您可以检查包含的脚本,包括打开每个包含的文件。 In this way, you can doublecheck to make sure the browser is able to get to your included files. 这样,您可以仔细检查以确保浏览器能够访问您包含的文件。

http://getfirebug.com/ http://getfirebug.com/

http://getfirebug.com/wiki/index.php/Script_Panel http://getfirebug.com/wiki/index.php/Scr​​ipt_Panel

http://getfirebug.com/wiki/index.php/File:Script_Panel.png <<< see del-linkrolls.js close to top, right; http://getfirebug.com/wiki/index.php/File:Script_Panel.png <<<参见del-linkrolls.js,位于右上角; that's where you select which file to inspect 在这里您可以选择要检查的文件

When I loaded the page I got an ".ready() is not a function" which would mean you are not loading jQuery. 当我加载页面时,我得到一个“ .ready()不是函数”,这意味着您没有加载jQuery。 Then again I've never fooled around with jsfiddle 再说一次,我从来没有与jsfiddle混蛋

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM