Jquery 无法使光谱颜色选择器工作_Jquery_Html_Color Picker

Jquery 无法使光谱颜色选择器工作

jquery html

Jquery 无法使光谱颜色选择器工作,jquery,html,color-picker,Jquery,Html,Color Picker,我正在尝试实现光谱颜色选择器我将spectrum css文件、spectrum js文件以及jquery 1.9.0文件与html文件放在同一个文件夹中我得到的只是屏幕上的一个输入框，没有颜色选择器。我试过firefox/chrome和IE，但什么都没试过我看不到任何地方，它说我需要任何额外的文件我想这可能是很明显的事情，有谁能帮忙吗下面是html文件的代码 <!DOCTYPE html> <html> <meta charset="utf-8" /&

我正在尝试实现光谱颜色选择器

我将spectrum css文件、spectrum js文件以及jquery 1.9.0文件与html文件放在同一个文件夹中

我得到的只是屏幕上的一个输入框，没有颜色选择器。我试过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>


$（“.my_color”）.光谱({
颜色：“f00”
});

确保在DOM加载完成后调用脚本，例如

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

使用正确的执行顺序可以正常工作：

注意：在DOM完成加载之前调用JavaScript时，它不再工作了

另一个问题是：

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

请注意

“spectrum.css”

末尾的额外空间，即没有加载JavaScript文件。如果看不到您正在使用的页面，就无法判断

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

必须在输入框后面

尝试将

放在页面末尾，或使用

$（document）.ready（function（）{…script here…}）我发现js$（“.my_color”）.spectrum（{color:”#f00“}）；现在需要重新输入working@BarryWatts它不必去追。这只是意味着它会在之后得到评估。最好还是使用$（document）.ready（）
，因为您确保在加载JavaScript之前完成DOM，并且JavaScript可以在页面上的任何位置运行。只需添加$（function（）{}）
是$（document.ready（function（）{}）的缩写如上所述，它不必放在受影响的元素之后。它必须在输入加载到页面上后进行计算。