javascript - 选择后如何从输入颜色中获取新的颜色值？

Question

我使用输入颜色来更改表格单元格中文本的颜色。

我可以选择单元格，单击颜色按钮，选择颜色并按 Enter 键(在 Chrome 上)。

我的问题是，只有在我再次按下颜色按钮(并且窗口再次打开......)后，颜色才会改变。

选择新颜色后如何更改/获取元素的值而无需再次单击它？

这与我用于输入颜色的EventListener有关吗？

我需要为此使用 JavaScript，没有 jQuery。

Answer 1

您可以通过onchange事件获取输入值。

jQuery('#color').on('change',function(){
	jQuery('#choosen-color').text(jQuery(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="color" id="color">
<div id="choosen-color"></div>

更新

document.getElementById('color').onchange=function(){
	// do whatever you want with value
  alert(this.value);
}

<input type="color" id="color">