javascript - 我无法让光谱颜色选择器工作。我缺少什么?

标签 javascript jquery colors picker

回复:http://jsfiddle.net/bgrins/ctkY3/

我迷茫了。我无法让这个颜色选择器(或任何颜色选择器)工作。

以下是测试页面的全部 HTML 内容。

我已经链接了jquery。

据我所知,链接上的路径(.js 和 .css)是正确的。

我还尝试将内联初始化包装在“$(document).ready(function()”中,但这没有帮助。我得到的只是常规文本框。它在多个浏览器和多个浏览器上对我不起作用设备。

有人能看到我错过的东西吗?

这可能是一些简单的事情,我会感到尴尬,但我非常渴望有一个好的颜色选择器工作。这是我尝试过的第三次。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Spectrum Color Picker - Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="include/spectrum/spectrum.js"></script>
<link rel="stylesheet" href="include/spectrum/spectrum.css" />

<script>
$(".basic").spectrum({
    color: "#f00",
    change: function(color) {
            $("#basic-log").text("change called: " + color.toHexString());
    }
});
</script>

</head>

<body>
<h2>Basic Usage</h2>
<input type='text' class="basic"/>
<em id='basic-log'></em>
</body>
</html>

最佳答案

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="http://bgrins.github.io/spectrum/spectrum.css">
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="http://bgrins.github.io/spectrum/spectrum.js"></script>
</head>

<body>
    <h2>Basic Usage</h2>
    <input type='text' class="basic" />
    <em id='basic-log'></em>
    <script>
        $(".basic").spectrum({
            color: "#f00",
            change: function (color) {
                $("#basic-log").text("change called: " + color.toHexString());
            }
        });
    </script>
</body>

</html>

这绝对有效,我唯一能想到的是 cssjs 未正确加载。

关于javascript - 我无法让光谱颜色选择器工作。我缺少什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61071578/

相关文章:

javascript - 向 meteor 中的用户集合添加字段的正确方法

javascript - 如何在 json 值中使用一些 html 元素标签

java - 在android中覆盖/替换/res/values/color.xml

java - 如何使用JButton?

javascript - 如何在knockoutjs中绑定(bind)输入类型= 'email'

R Leaflet GeoJSON着色

javascript - 了解 Javascript .sort 参数

javascript - 当使用 Promise.reject 生成数组时,我得到了成功响应

javascript - 如何在需要显示的表格隐藏行上制作幻灯片动画?

javascript - 在一段代码的每个跨度内替换文本