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


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宝典学习笔记
Feb 07 Javascript
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
Aug 23 Javascript
判断javascript的数据类型(示例代码)
Dec 11 Javascript
JavaScript知识点整理
Dec 09 Javascript
javascript特殊日历控件分享
Mar 07 Javascript
jQuery实现内容定时切换效果完整实例
Apr 06 Javascript
Javascript中级语法快速入手
Jul 30 Javascript
web前端开发upload上传头像js示例代码
Oct 22 Javascript
微信小程序链接传参并跳转新页面
Nov 29 Javascript
Reactjs实现通用分页组件的实例代码
Jan 19 Javascript
Vue 使用 Mint UI 实现左滑删除效果CellSwipe
Apr 27 Javascript
如何用JS实现网页瀑布流布局
Apr 24 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编程注意事项的小结
2013/04/27 PHP
PHP读取大文件的类SplFileObject使用介绍
2014/04/09 PHP
Laravel5.1 框架控制器基础用法实例分析
2020/01/04 PHP
JavaScript中null与undefined分析
2009/07/25 Javascript
js星星评分效果
2014/07/24 Javascript
JS自定义对象实现Java中Map对象功能的方法
2015/01/20 Javascript
AngularJS中实现显示或隐藏动画效果的方式总结
2015/12/31 Javascript
基于Bootstrap使用jQuery实现输入框组input-group的添加与删除
2016/05/03 Javascript
json对象与数组以及转换成js对象的简单实现方法
2016/06/24 Javascript
vue.js 实现输入框动态添加功能
2018/06/25 Javascript
详解vantUI框架在vue项目中的应用踩坑
2018/12/06 Javascript
详解javascript replace高级用法
2019/02/17 Javascript
JS左右无缝轮播功能完整实例
2019/05/16 Javascript
微信小程序实现收货地址左滑删除
2020/11/18 Javascript
vue 兄弟组件的信息传递的方法实例详解
2019/08/30 Javascript
Vue中使用better-scroll实现轮播图组件
2020/03/07 Javascript
VueCli4项目配置反向代理proxy的方法步骤
2020/05/17 Javascript
Bootstrap table 服务器端分页功能实现方法示例
2020/06/01 Javascript
vue-cli —— 如何局部修改Element样式
2020/10/22 Javascript
Element-ui 自带的两种远程搜索(模糊查询)用法讲解
2021/01/29 Javascript
[00:43]FTP典藏礼包 DOTA2三大英雄霸气新套装
2014/03/21 DOTA
Python数据结构与算法之列表(链表,linked list)简单实现
2017/10/30 Python
python将四元数变换为旋转矩阵的实例
2019/12/04 Python
tensorflow 重置/清除计算图的实现
2020/01/19 Python
python 连续不等式语法糖实例
2020/04/15 Python
一款纯css3实现的颜色渐变按钮的代码教程
2014/11/12 HTML / CSS
什么是静态路由?什么是动态路由?各自的特点是什么?
2015/09/16 面试题
陈欧广告词
2014/03/14 职场文书
和谐家庭事迹材料
2014/12/20 职场文书
2015小学语文教师个人工作总结
2015/05/20 职场文书
2015年创先争优工作总结
2015/05/23 职场文书
小人国观后感
2015/06/11 职场文书
车辆安全隐患排查制度
2015/08/05 职场文书
PHP命令行与定时任务
2021/04/01 PHP
python基础之文件处理知识总结
2021/05/23 Python
Redis主从配置和底层实现原理解析(实战记录)
2021/06/30 Redis