如何从JS代码

触发颜色对话框我有如何从JS代码

<input type="color" id="colorDialogID"> 
<div id="textToColorID">Text to color</div> 
<input type="button" id="setColorButtonID">

，我通过点击按钮来显示颜色对话框想。而当我选择特定的颜色并按下'确定'，一些文本来获得选择的颜色。

我需要为这个js代码。我现在用google搜索了将近一个小时，找到了一种如何从代码中显示代码选择器窗口的方法，但没有成功。我只得到一些插件。我不明白为什么一切都必须如此复杂javascript。

来源

2017-08-07 ivan golubar

分享一些你的'js'代码，这样我们就可以看到你想要做什么。问题很难理解。 –

OK，以供将来参考这是一件好事，为您的代码片段 - 甚至更好的jsfiddle链接，但是这是我现在得到。

document.getElementById("setColorButtonID").addEventListener("click", function() { 
 
    document.getElementById("colorDialogID").focus(); 
 
    document.getElementById("colorDialogID").value = "#FFCC00"; //Set the default color NOTE: Remove the line to get the default of #000000 
 
    document.getElementById("colorDialogID").click(); 
 
}); 
 

 
function getColor() { 
 
    var color = document.getElementById("colorDialogID").value; 
 
    document.getElementById("textToColorID").style.color = color; 
 
}

#colorDialogID { 
 
    position: absolute; 
 
    visibility: hidden; 
 
}

<input type="color" id="colorDialogID" onchange="getColor(this)"> 
 
<div id="textToColorID">Text to color</div> 
 
<input type="button" id="setColorButtonID" value="Edit Color">

我可以添加一些注释代码，如果你想逐行解释 - 但这应该工作。

希望它能帮助:)

来源

2017-08-07 21:30:26

我需要一个按钮，因为这是向我展示如何从JavaScript代码来触发，称之为“拾色器对话框中的”最简单的方法。而且我不想使用颜色选择器作为按钮，因为它看起来不像按钮。用户不会将其视为按钮。为什么我应该在CSS上工作来更改颜色选择器按钮。 –

我用的提示对话框，在我指导我的应用程序的用户：“之所以选择颜色......”所以，当点击“确定”后拾色器有出现。 –

@ivangolubar看到我上面的编辑。您也可以通过点击“运行代码段”按钮，在底部:) –

-1

看看jscolor。它很简单，你可以很容易地找到你正在寻找的功能。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.0.4/jscolor.min.js"></script> 
 

 
Color: <input class="jscolor" value="ab2567">

来源

2017-08-07 21:40:09 Zulfe

如何从JS代码

回答

相关问题