Question

我正在尝试通过点击div来使用jscolor创建一个颜色选择器，这样的东西不起作用。

<div id='aa'>make anohter</div>
<div id='bb'></div>
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jscolor/jscolor.js"></script> 
<script>
$( "#aa" ).click(function() {
    document.getElementById("bb").innerHTML = "<input class='color'>";
});
</script>

我在div中创建了一个输入，但不是jscolor 我最初想在div上使用.load（'sample.html'），sample.html有一个颜色选择器，但它也没有用。我尝试了很多东西，但这似乎有效：

$('#somediv').click(function(){
$('#colorpicker').appendTo( "#newplace" )};

然后它将删除#colorpicker，这将使我的点击工作只有一次。我尝试使用克隆方法，但没有用。
提前谢谢！

Answer 1

$("#aa").click(function() {
  document.getElementById("bb").innerHTML = "<input class='color'>";
  jscolor.installByClassName('color');
});

#aa {
  cursor: pointer;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.0.4/jscolor.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

<div id='aa'>Show JS color pickr</div>
<div id='bb'></div>

通过单击事件创建jscolor，或者将包含jscolor的sample.html加载到div中

1 个答案: