/* @author:luowen @time:2013-10-08 @desc:js to rgb color */ <!doctype html> <html> <head> <title>js to rgb color</title> <charset='utf-8' /> </head> <body> <input type='text' id='color' /> <button id="change">change to ten</button> <span>eg: (#fff) ==> rgb(255,255,255)</span> <br /> <input type="text" id="res" value="" /> </body> <script type="text/javascript"> //获取对象 function $(id){ return document.getElementById(id); } //响应点击函数 $('change').onclick = function(){ if($('color').value == ''){ alert('请输入需要转化的值如:#fff'); return; } toRGB($('color').value); } function toRGB(msg){ var re = new RegExp(/^#([0-9a-fA-F]){3,6}$/); var flag = msg.match(re); //alert(flag); if(flag == null){ //alert(msg); $('res').value = msg; $('res').style.color = 'red'; } else{ //#11 11 11 var resStr = msg.substr(1); var resArr = spiltArr(resStr); var rgb = toTen(resArr); //console.log(resTen); //alert('rgb'+'('+rgb+')'); $('res').value = 'rgb'+'('+rgb+')'; $('res').style.color = 'blue'; } } //将拿到的字符转化成十进制 function toTen(arr){ var rgb = ['','','']; for(var i = 0;i < 3; i++){ rgb[i] = parseInt(arr[i],16); } return rgb; } //将字符串分割成(cc,dd,ff)形式 function spiltArr(str){ var tmp = ['','','']; var strLen = str.length; if(strLen == 3){ var a = str.substr(0,1); var b = str.substr(1,1); var c = str.substr(2,1); tmp[0] = a + a; tmp[1] = b + b; tmp[2] = c + c; return tmp; } else if(strLen == 6){ tmp[0] = str.substr(0,2); tmp[1] = str.substr(2,2); tmp[2] = str.substr(4,2); return tmp; } } </script> </html>
