6

我正在尝试实现光谱颜色选择器http://bgrins.github.io/spectrum/

我在与 html 文件相同的文件夹中有频谱 css 文件和频谱 js 文件以及 jquery 1.9.0 文件。

我得到的只是屏幕上的一个输入框,没有颜色选择器。我已经在 firefox/chrome 和 IE 中尝试过,但没有。

我看不到任何地方说我需要任何其他文件

谁能帮忙,因为我认为这可能很明显

这是html文件的代码

<!DOCTYPE html>
 <html>
 <meta charset="utf-8" />
 <head>
   <link rel="stylesheet" type="text/css" href="spectrum.css ">
   <script type="text/javascript" src="jquery-1.9.0.js"></script>
   <script type="text/javascript" src="spectrum.js"></script>
   <script>
     $(".my_color").spectrum({
        color: "#f00"
     });
   </script>
  </head>

  <body>
   <input type='text' class="my_color" />
  </body>
  </html>
4

2 回答 2

8

确保在 DOM 完成加载后调用您的脚本,例如,

$(document).ready(function() {
   $(".my_color").spectrum({
      color: "#f00"
   });
});

使用正确的执行顺序可以正常工作:http: //jsfiddle.net/xqdBd/

请注意:http: //jsfiddle.net/xqdBd/1/不再起作用,因为在 DOM 完成加载之前调用了 JavaScript。

另一个问题在这里:

<link rel="stylesheet" type="text/css" href="spectrum.css ">

请注意末尾的额外空间"spectrum.css ",或者您的 JavaScript 文件没有被加载。如果没有看到您正在使用的页面,就无法判断。

于 2013-05-02T09:44:15.390 回答
-3

js

$(".my_color").spectrum({
    color: "#f00"
});

必须去输入框后面

于 2013-05-02T09:48:09.537 回答