最近做后台字幕设计，突然发现，每次调用拾色器，都要去开发工具里调用，很麻烦。wex5没有提供拾色器组件，能不能把拾色器组装到wex5的编辑页面中呢？这样可以把颜色值写到数据库里，供前后台动态调用与修改颜色的值。经过一番研究，测试，可以的。
一 、效果演示：
点击拾色器，弹出拾色器窗口
点击应用按钮，将颜色应用到字幕上
二、设计思路：
用插入标签的方法，将h5的color元素插入到wex5页面中，用js和wex5组件配合，将颜色值取出，用css方法实现更改字幕颜色。
三、代码逻辑与实现：
1.创建字幕表，加入color字段
2.在合适位置插入color标签，定义id
3、加入button按钮和input组件
注意事项：1.color调用的是浏览器的拾色器，没有触发事件可以调用，所以用button来取值。
2.input组件与数据库绑定，同时显示color当前值。
4 、取值赋值（如此简单，是的）
Model.prototype.colorBtnClick = function(event){
var color=document.getElementById("color").value; //用id选择color对像，并取值
$(".text").css("color",color); //用class选择器进行样式改变
this.comp("outputColor").set("value",color); //将颜色值赋给input组件
};
注意事项：
1.用input来显示有2个优点，一是绑定数据库中的color值，可以写入写出，二是可以复用鼠标圈中复制input框内的 值，供其它页面使用。
2.在wex5的方法中例用js方法是可行的，在js方法中写wex5的方法会出错。
5.确定保存：
baasdata.save(),将数据写入数据库。
相关视频制作完成，上传优酷。教学app制作中。我是邯郸戏曲开发，tel：15175073123,qq:1017945251
扫描二维码，看高清教学视频。