前端怎么验证颜色的HEX值合法才能提交,最简洁写法无需js!

直接使用输入框的pattern属性.代码如下:

<input type="text" name="color" pattern="[0-9a-fA-F]{6}" title="请输出正确颜色值">

当输入框有值,提交表单前就会验证输出入值是否符合pattern属性指定的正则规则,不符合就会弹出title属性指定的提示,并阻止表单提交.是不是很简洁!js都不用写.注意本例子的正则规则对应大小写不敏感,也就是FFFFFF和ffffff都是合法的.此外因为没输出值是不会验证的,所以如果你一定要验证该值,那么可以在input上加个required属性,强制填写即可满足要求.