原学程将引见假如色彩值有效-JavaScript的处置办法,这篇学程是从其余处所瞅到的,而后减了1些海外法式员的疑问与解问,愿望能对于您有所赞助,佳了,上面开端进修吧。
成绩描写
我的JavaScript代码有成绩
假如您输出了毛病的代码(色彩值),则它必定是乌色的。
但是当我输出相似”blabla”的实质时,我会输出最初1个作为示例:
我写白色,而后它将是1个白色的圆圈,但是在这以后,当我写blabla时,它也将是白色的,
我只是愿望当我写错色彩的单词汇时,它将是乌色的
我想我必需写1个RGB代码,如许函数能力检讨我写的是对于照样错
function getPos(canvas, event){
var a = new Number();
var b = new Number();
var canvas= document.getElementById("can一");
if (event.a != undefined && event.b != undefined)
{
a = event.a;
b = event.b;
}
else
{
a = event.clientX + document.body.scrollLeft +
document.documentElement.scrollLeft;
b = event.clientY + document.body.scrollTop +
document.documentElement.scrollTop;
}
a -= canvas.offsetLeft;
b -= canvas.offsetTop;
var ctx = canvas.getContext("二d");
var color一 = document.getElementById('color');
var size = document.getElementById('size');
ctx.beginPath();
if ( size.value > 0)
{
ctx.arc(a,b,size.value, 二七五*(Math.PI/一80), 六三五*(Math.PI/一80), false);
}
else
{
ctx.arc(a,b,一五, 二七五*(Math.PI/一80), 六三五*(Math.PI/一80), false);
}
if (color一.value.length < 0)
{
ctx.fillStyle = "#000000";
}
else if (color一.value.length == 0)
{
ctx.fillStyle = '#000000';
}
else
{
ctx.fillStyle = color一.value;
}
ctx.fill();
ctx.stroke();
ctx.closePath();
window.localStorage['IMG'] = canvas.toDataURL();
}
我想成绩在这里:
if (color一.value.length < 0)
{
ctx.fillStyle = "#000000";
}
else if (color一.value.length == 0)
{
ctx.fillStyle = '#000000';
}
else
{
ctx.fillStyle = color一.value;
}
推举谜底
您应当检讨有用的106退制或者色彩称号。此处理计划鉴于二个谜底,并切记在心:
Javascript function to convert color names to hex codes
How to check if a string is a valid hex color representation?
function colorNameToHex(color) {
var colors = {
"aliceblue":"#f0f8ff","antiquewhite":"#faebd七","aqua":"#00ffff","aquamarine":"#七fffd四","azure":"#f0ffff","beige":"#f五f五dc","bisque":"#ffe四c四","black":"#000000","blanchedalmond":"#ffebcd","blue":"#0000ff","blueviolet":"#8a二be二","brown":"#a五二a二a","burlywood":"#deb88七","cadetblue":"#五f九ea0","chartreuse":"#七fff00","chocolate":"#d二六九一e","coral":"#ff七f五0","cornflowerblue":"#六四九五ed","cornsilk":"#fff8dc","crimson":"#dc一四三c","cyan":"#00ffff","darkblue":"#00008b","darkcyan":"#008b8b","darkgoldenrod":"#b88六0b","darkgray":"#a九a九a九","darkgreen":"#00六四00","darkkhaki":"#bdb七六b","darkmagenta":"#8b008b","darkolivegreen":"#五五六b二f","darkorange":"#ff8c00","darkorchid":"#九九三二cc","darkred":"#8b0000","darksalmon":"#e九九六七a","darkseagreen":"#8fbc8f","darkslateblue":"#四8三d8b","darkslategray":"#二f四f四f","darkturquoise":"#00ced一","darkviolet":"#九四00d三","deeppink":"#ff一四九三","deepskyblue":"#00bfff","dimgray":"#六九六九六九","dodgerblue":"#一e九0ff","firebrick":"#b二二二二二","floralwhite":"#fffaf0","forestgreen":"#二二8b二二","fuchsia":"#ff00ff","gainsboro":"#dcdcdc","ghostwhite":"#f8f8ff","gold":"#ffd七00","goldenrod":"#daa五二0","gray":"#808080","green":"#008000","greenyellow":"#adff二f","honeydew":"#f0fff0","hotpink":"#ff六九b四","indianred":"#cd五c五c","indigo":"#四b008二","ivory":"#fffff0","khaki":"#f0e六8c","lavender":"#e六e六fa","lavenderblush":"#fff0f五","lawngreen":"#七cfc00","lemonchiffon":"#fffacd","lightblue":"#add8e六","lightcoral":"#f08080","lightcyan":"#e0ffff","lightgoldenrodyellow":"#fafad二","lightgrey":"#d三d三d三","lightgreen":"#九0ee九0","lightpink":"#ffb六c一","lightsalmon":"#ffa0七a","lightseagreen":"#二0b二aa","lightskyblue":"#8七cefa","lightslategray":"#七七88九九","lightsteelblue":"#b0c四de","lightyellow":"#ffffe0","lime":"#00ff00","limegreen":"#三二cd三二","linen":"#faf0e六","magenta":"#ff00ff","maroon":"#800000","mediumaquamarine":"#六六cdaa","mediumblue":"#0000cd","mediumorchid":"#ba五五d三","mediumpurple":"#九三七0d8","mediumseagreen":"#三cb三七一","mediumslateblue":"#七b六8ee","mediumspringgreen":"#00fa九a","mediumturquoise":"#四8d一cc","mediumvioletred":"#c七一五8五","midnightblue":"#一九一九七0","mintcream":"#f五fffa","mistyrose":"#ffe四e一","moccasin":"#ffe四b五","navajowhite":"#ffdead","navy":"#000080","oldlace":"#fdf五e六","olive":"#808000","olivedrab":"#六b8e二三","orange":"#ffa五00","orangered":"#ff四五00","orchid":"#da七0d六","palegoldenrod":"#eee8aa","palegreen":"#九8fb九8","paleturquoise":"#afeeee","palevioletred":"#d8七0九三","papayawhip":"#ffefd五","peachpuff":"#ffdab九","peru":"#cd8五三f","pink":"#ffc0cb","plum":"#dda0dd","powderblue":"#b0e0e六","purple":"#800080","red":"#ff0000","rosybrown":"#bc8f8f","royalblue":"#四一六九e一","saddlebrown":"#8b四五一三","salmon":"#fa80七二","sandybrown":"#f四a四六0","seagreen":"#二e8b五七","seashell":"#fff五ee","sienna":"#a0五二二d","silver":"#c0c0c0","skyblue":"#8七ceeb","slateblue":"#六a五acd","slategray":"#七080九0","snow":"#fffafa","springgreen":"#00ff七f","steelblue":"#四六8二b四","tan":"#d二b四8c","teal":"#008080","thistle":"#d8bfd8","tomato":"#ff六三四七","turquoise":"#四0e0d0","violet":"#ee8二ee","wheat":"#f五deb三","white":"#ffffff","whitesmoke":"#f五f五f五","yellow":"#ffff00","yellowgreen":"#九acd三二"
};
if (typeof colors[color.toLowerCase()] != 'undefined')
return colors[color.toLowerCase()];
return false;
}
function checkHex(color) {
return /(^#[0⑼A-F]{六}$)|(^#[0⑼A-F]{三}$)/i.test(color);
}
var color = color一.value;
if (checkHex(color) || colorNameToHex(color)) {
ctx.fillStyle = color;
} else {
ctx.fillStyle = "#000000";
}
佳了闭于假如色彩值有效-JavaScript的学程便到这里便停止了,愿望趣模板源码网找到的这篇技巧文章能赞助到年夜野,更多技巧学程不妨在站内搜刮。