判断颜色是否合法的正则表达式(详解)


Posted in Javascript onMay 03, 2017

"^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$";

意思是:以#开头,后面是数字和a-f的字符(大写或小写),这个值是6位或3位。要匹配一个3为是为了符合css颜色的简写规则:

"#abc"=="#aabbcc"

注意:如果需要进行16位和10位的转换,比如将颜色值转成int存在数据库,如果是6位的颜色没问题,如果是3位的颜色就有问题了,因为当你取回来从10进制转为

16进制的时候,你不知道他应该是3位还是6位。

比如:#0000ff==转10进制==>255。如果是转回来呢:255==转16进制==>ff,如果你知道是6位你可以自己加上“#0000”就变成“#0000ff”,如果是三位就变成“#0ff”

因此,如果是需要转10进制保存的情况下,不应该让3位的颜色值存在,或者应该在保存之前给他统一转成6位的颜色值再转10进制。

以上这篇判断颜色是否合法的正则表达式(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
如何用js控制css中的float的代码
Aug 16 Javascript
使用JavaScript switch case 另类写法
Mar 14 Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 Javascript
js运动框架_包括图片的淡入淡出效果
May 11 Javascript
js判断字符长度以及中英文数字等
Dec 31 Javascript
以JavaScript来实现WordPress中的二级导航菜单的方法
Dec 14 Javascript
Vue.JS入门教程之处理表单
Dec 01 Javascript
使用Xcache缓存器加速PHP网站的配置方法
Apr 22 Javascript
vue 项目常用加载器及配置详解
Jan 22 Javascript
深入理解js 中async 函数的含义和用法
May 13 Javascript
解决vue admin element noCache设置无效的问题
Nov 12 Javascript
原生JS实现拖拽功能
Dec 16 Javascript
Vue input控件通过value绑定动态属性及修饰符的方法
May 03 #Javascript
ES6中参数的默认值语法介绍
May 03 #Javascript
Express之get,pos请求参数的获取
May 02 #Javascript
利用prop-types第三方库对组件的props中的变量进行类型检测
May 02 #Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
May 02 #Javascript
JavaScript比较两个数组的内容是否相同(推荐)
May 02 #Javascript
xmlplus组件设计系列之分隔框(DividedBox)(8)
May 02 #Javascript
You might like
简体中文转换为繁体中文的PHP函数
2006/10/09 PHP
基于Windows下Apache PHP5.3.1安装教程
2010/01/08 PHP
php实现天干地支计算器示例
2014/03/14 PHP
PHP使用glob函数遍历目录或文件夹的方法
2014/12/16 PHP
PHP使用逆波兰式计算工资的方法
2015/07/29 PHP
PHP中类属性与类静态变量的访问方法示例
2016/07/13 PHP
PHP正则匹配操作简单示例【preg_match_all应用】
2017/07/10 PHP
原生Js实现按的数据源均分时间点幻灯片效果(已封装)
2010/12/28 Javascript
使用js在页面中绘制表格核心代码
2013/09/16 Javascript
jquery mobile页面跳转后样式丢失js失效的解决方法
2014/09/06 Javascript
JS使用正则实现去掉字符串左右空格的方法
2016/12/27 Javascript
JS实现的验证身份证及获取地区功能示例
2017/01/16 Javascript
nodejs构建本地web测试服务器 如何解决访问静态资源问题
2017/07/14 NodeJs
jQuery实现的上传图片本地预览效果简单示例
2018/03/29 jQuery
jQuery轻量级表单模型验证插件
2018/10/15 jQuery
Vue中使用canvas方法总结
2019/02/12 Javascript
VUE 实现复制内容到剪贴板的两种方法
2019/04/24 Javascript
浅谈JS中this在各个场景下的指向
2019/08/14 Javascript
jstree中的checkbox默认选中和隐藏示例代码
2019/12/29 Javascript
[03:23]我的刀塔你不可能这么可爱 第一期金萌萌的故事
2014/06/20 DOTA
基于Linux系统中python matplotlib画图的中文显示问题的解决方法
2017/06/15 Python
python实现的按要求生成手机号功能示例
2019/10/08 Python
python脚本调用iftop 统计业务应用流量的思路详解
2019/10/11 Python
Django微信小程序后台开发教程的实现
2020/06/03 Python
如何在Python对Excel进行读取
2020/06/04 Python
PyCharm+Miniconda3安装配置教程详解
2021/02/16 Python
领先的钻石和订婚戒指零售商:Diamonds-USA
2016/12/11 全球购物
印尼旅游网站:via
2017/11/12 全球购物
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
奠基仪式主持词
2014/03/20 职场文书
董事长岗位职责
2015/02/13 职场文书
小学生安全教育心得体会
2016/01/15 职场文书
pyqt5打包成exe可执行文件的方法
2021/05/14 Python
Win11绿屏怎么办?Win11绿屏死机的解决方法
2021/11/21 数码科技
Oracle 触发器trigger使用案例
2022/02/24 Oracle
使用CSS实现黑白格背景效果
2022/06/01 HTML / CSS