HTML5之input的类型color，通过input：color来改变背景颜色或者字体颜色

问题所在：改变了拾色器中颜色的值后并没有在相关元素上体现出来

 

    
    
    
    



    

        当前值：

        
        
        

        选择文本字体颜色：

        
        
背景颜色展示
    
    

问题描述：在拾色器中更改颜色后，文本字体颜色不随着改变

原因：input,color中不能主动触发click事件，据说是安全方面的考虑

问题解决：加上

Color.click() // 必须添加触发click事件否则不能通过点击确定按钮触发更改颜色

 模拟用户操作，来达到单击的效果 

注意点：

change事件的触发时刻：在拾色器更换完颜色后，点击确定按钮后才触发change事件，进入处理函数。

另外一种解决方法：

采用CSS原生变量，当拾色器改变时，直接修改--color值即可。

    
    
    
    
 


    

        当前值：

        
        
        

        选择文本字体颜色：

        
        
背景颜色展示