onChange事件在颜色类型输入中不起作用 [英] onChange event is not working in color type input

问题描述

我进行了很多搜索，并找到关于stackoverflow的答案，但徒劳无功.我想在input字段中更改颜色时获得颜色值. 这是我的代码，请检查它为什么不起作用.

I search a lot and find answer on stackoverflow but all in vain nothing is working for me. I want to get the color value when color is changed in input field. Here is my code please check this why its not working.

 <input type="color" id="bgcolor" value="#ffffff" onchange="test()" />

这是JavaScript代码.

Here is javascript code.

 function test(){
    console.log('working.....'); 
 }

此功能不起作用，如果您将onChange替换为onclick，则可以正常工作，但为什么不能使用onChange.

This function is not working, if you replace onChange with onclick it's working fine but why not for onChange.

谢谢.

推荐答案

在Windows上的Chrome和Firefox上，我都得到相同的行为，并且仅在纯黑色，纯白色或任何非常接近其中任一颜色的颜色下才会发生这种情况

I get the same behavior both with Chrome and Firefox on Windows and it only occurs with pure black, pure white, o any color very close to either one of them.

如果您查看颜色选择器"，您会注意到将光标移到主方框中时rgb值不会改变(如果您使用右侧的垂直滑块，它们会改变，但是那不是平均值用户会倾向于这样做).

If you look at the Color picker you'll notice that the rgb values don't change when you move the cursor in the main square (they do if you use the vertical slider to the right, but that's not what the average user would tend to do).

使用相同颜色选择器的其他应用程序也会发生相同的行为，例如MSpaint或Tkinter的tkColorChooser.askcolor().我认为这是Window的默认颜色选择器，因为颜色"具有英式英语拼写颜色"，这是我的默认语言选择.

The same behavior occurs with other applications using the same color picker, for instance MSpaint or Tkinter's tkColorChooser.askcolor(). I assume this is Window's default color picker since "color" has the British English spelling "colour", that's my default language choice.

要解决此问题，只需使用不是#ffffff或#000000(或接近)的任何颜色作为起始颜色.

To fix this, just use any color that's not #ffffff or #000000 (or close) as your start color.

<label for="doesntWork1">doesn't work</label> <input type="color" id="doesntWork1" value="#ffffff" onchange="alert(this.value);" />
<p>
<label for="doesntWork2">doesn't work</label> <input type="color" id="doesntWork2" value="#000000" onchange="alert(this.value);" />
<p>
<label for="works1">works</label> <input type="color" id="works1" value="#fdffff" onchange="alert(this.value);" />
<p>
<label for="works2">works</label> <input type="color" id="works2" value="#000002" onchange="alert(this.value);" />

这篇关于onChange事件在颜色类型输入中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！