javascript - 如何覆盖用户选择的 HTML 颜色输入值

标签 javascript html dom

我正在制作一个网络应用程序来控制一组 LED,但在更改 HTML 颜色输入中显示的颜色时遇到一些问题。我需要近乎实时地向用户展示 LED 的当前颜色,因为它可能会因其他因素而发生变化。

我可以使用 obj.setAttribute("value", color) 设置输入的颜色,该颜色始终有效,但输入的实际颜色仅在用户尚未选择颜色时才会改变。换句话说,输入元素的颜色仅在用户选择颜色之前反射(reflect)“值”属性,之后显示的颜色始终是用户选择的颜色。

setInterval(setColor, 500);

function setColor() {
  document.getElementById("color")
    .setAttribute("value", '#'+Math.floor(Math.random() * 16777215).toString(16));
}
<html>

<body>
  <input type="color" id="color" value="#000000">
</body>

</html>

我希望能够在需要时更改颜色输入元素上显示的实际颜色。这可能吗?

最佳答案

尝试:

setInterval(setColor, 500);

function setColor() {
  document.getElementById("color").value = '#' + Math.floor(Math.random() * 16777215).toString(16);
}

使用元素的.value而不是设置属性。

关于javascript - 如何覆盖用户选择的 HTML 颜色输入值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57716046/

相关文章:

javascript - 使用 CSS 基于 HTML 时间线的列表样式

javascript - VueJS Master Checkbox 切换数组值

javascript - 将 <param> 元素添加到 <object>

javascript - Firefox 扩展 - PageMod 脚本修改窗口

javascript - 自定义 Angular 指令来动态更改字体大小?

javascript - javascript中最大范围的连续整数

javascript - array.concat 与 angular.copy

javascript - 烦人的 React 错误... "TypeError: Cannot read property ' My_Items' of null”

jquery - 是否可以将图像放在 html 中的 <hr> 标记上方?

php - 如何使用 mPDF 库在 PDF 中并排保存两个元素?