我正在尝试从 eyecon.ro/colorpicker 实现 jquery colorpicker(最后一个)但每当我点击实际的颜色选择器时，什么都不会出现 jquery 会抛出此错误消息
$("#colorSelector").ColorPicker is not a function
onChange: function (hsb, hex, rgb) {
这是我的代码
js文件
// Colorpicker
$('#colorSelector').ColorPicker({
color: '#0000ff',
onShow: function (colpkr) {
$(colpkr).fadeIn(500);
return false;
},
onHide: function (colpkr) {
$(colpkr).fadeOut(500);
return false;
},
onChange: function (hsb, hex, rgb) {
$('#colorSelector div').css('backgroundColor', '#' + hex);
}
});
HTML 文件
<html>
<head>
<link rel="stylesheet" href="css/colorpicker.css" type="text/css" />
<link rel="stylesheet" media="screen" type="text/css" href="css/layout.css" />
<title>ColorPicker - jQuery plugin</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/colorpicker.js"></script>
<script type="text/javascript" src="js/eye.js"></script>
<script type="text/javascript" src="js/layout.js?ver=1.0.2"></script>
</head>
<body>
<div class="wrapper">
<p>
<div id="colorSelector"><div style="background-color: #0000ff"></div></div>
</p>
</div>
</body>
</html>
我已包含所有文件，但 css colorpicker 无法正常工作。关于如何消除该错误有什么建议吗？
最佳答案
<script type="text/javascript" src="jQuery/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="js/colorpicker.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var borderColor;
$('#tbcontentBorder').ColorPicker({
onSubmit : function(hsb, hex, rgb, el) {
$(el).val('#' + hex);
$(el).ColorPickerHide();
borderColor = $('#tbcontentBorder').val();
$('#news').css('border-color', borderColor);
},
onBeforeShow : function() {
$(this).ColorPickerSetColor(this.value);
}
}).bind('keyup', function() {
$(this).ColorPickerSetColor(this.value);
});
});
</script>
html
<div class="textBoxHolder">
<label >Select Color</label>
<input type="color" id="tbcontentBorder" />
</div>
它对我来说工作正常
关于jquery颜色选择器错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9790928/