2013-02-13 2 views
0

У меня возникла проблема с кодом JavaScript , если вы ввели неправильный код (значение цвета), тогда он должен быть черным. , но когда я вхожу в somthing, как «blablabla», тогда это будет то, что я набрал последнее для примера: Я пишу Красный, тогда это будет красный круг, но после этого, когда я напишу blablabla, тоже будет красным, Я просто хочу что, когда я пишу неправильный цвет слово будет черным Думаю, что я должен написать код RgB так Funktion будет проверять, если я пишу правильно или неправильноЕсли значение цвета недействительно - JavaScript

function getPos(canvas, event){ 

    var a = new Number(); 
    var b = new Number(); 
    var canvas= document.getElementById("can1"); 

    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("2d"); 
    var color1 = document.getElementById('color'); 
    var size = document.getElementById('size'); 
    ctx.beginPath(); 

    if (size.value > 0) 
     { 
     ctx.arc(a,b,size.value, 275*(Math.PI/180), 635*(Math.PI/180), false); 
     } 
    else 
     { 
     ctx.arc(a,b,15, 275*(Math.PI/180), 635*(Math.PI/180), false); 
     } 




    if (color1.value.length < 0) 
     { 
     ctx.fillStyle = "#000000"; 

     } 

    else if (color1.value.length == 0) 
     { 
     ctx.fillStyle = '#000000'; 
     } 

    else 
     { 
     ctx.fillStyle = color1.value; 
     } 



     ctx.fill(); 
     ctx.stroke(); 
     ctx.closePath(); 
     window.localStorage['IMG'] = canvas.toDataURL(); 
}  

проблема здесь я думаю:

if (color1.value.length < 0) 
     { 
     ctx.fillStyle = "#000000"; 

     } 

    else if (color1.value.length == 0) 
     { 
     ctx.fillStyle = '#000000'; 
     } 

    else 
     { 
     ctx.fillStyle = color1.value; 
     } 
+1

'color1.value.length' не может быть меньше, чем' 0'. Также нет ничего, что бы подтвердило данное имя цвета в коде. – Teemu

+0

точно, я пробовал с 1, но это будет одна и та же проблема, поэтому я не знаю, как написать код, проверяющий имена цветов, и когда я напишу неправильно, это будет стандартный или черный.! – NoWorries

+0

В чем разница между «неправильным кодом» и «blablabla»? – Bergi

ответ

1

Вы должны проверить на правильность шестнадцатеричном или названий цветов. Это решение строится из двух ответов и написано наизусть:


function colorNameToHex(color) { 
    var colors = { 
     "aliceblue":"#f0f8ff","antiquewhite":"#faebd7","aqua":"#00ffff","aquamarine":"#7fffd4","azure":"#f0ffff","beige":"#f5f5dc","bisque":"#ffe4c4","black":"#000000","blanchedalmond":"#ffebcd","blue":"#0000ff","blueviolet":"#8a2be2","brown":"#a52a2a","burlywood":"#deb887","cadetblue":"#5f9ea0","chartreuse":"#7fff00","chocolate":"#d2691e","coral":"#ff7f50","cornflowerblue":"#6495ed","cornsilk":"#fff8dc","crimson":"#dc143c","cyan":"#00ffff","darkblue":"#00008b","darkcyan":"#008b8b","darkgoldenrod":"#b8860b","darkgray":"#a9a9a9","darkgreen":"#006400","darkkhaki":"#bdb76b","darkmagenta":"#8b008b","darkolivegreen":"#556b2f","darkorange":"#ff8c00","darkorchid":"#9932cc","darkred":"#8b0000","darksalmon":"#e9967a","darkseagreen":"#8fbc8f","darkslateblue":"#483d8b","darkslategray":"#2f4f4f","darkturquoise":"#00ced1","darkviolet":"#9400d3","deeppink":"#ff1493","deepskyblue":"#00bfff","dimgray":"#696969","dodgerblue":"#1e90ff","firebrick":"#b22222","floralwhite":"#fffaf0","forestgreen":"#228b22","fuchsia":"#ff00ff","gainsboro":"#dcdcdc","ghostwhite":"#f8f8ff","gold":"#ffd700","goldenrod":"#daa520","gray":"#808080","green":"#008000","greenyellow":"#adff2f","honeydew":"#f0fff0","hotpink":"#ff69b4","indianred":"#cd5c5c","indigo":"#4b0082","ivory":"#fffff0","khaki":"#f0e68c","lavender":"#e6e6fa","lavenderblush":"#fff0f5","lawngreen":"#7cfc00","lemonchiffon":"#fffacd","lightblue":"#add8e6","lightcoral":"#f08080","lightcyan":"#e0ffff","lightgoldenrodyellow":"#fafad2","lightgrey":"#d3d3d3","lightgreen":"#90ee90","lightpink":"#ffb6c1","lightsalmon":"#ffa07a","lightseagreen":"#20b2aa","lightskyblue":"#87cefa","lightslategray":"#778899","lightsteelblue":"#b0c4de","lightyellow":"#ffffe0","lime":"#00ff00","limegreen":"#32cd32","linen":"#faf0e6","magenta":"#ff00ff","maroon":"#800000","mediumaquamarine":"#66cdaa","mediumblue":"#0000cd","mediumorchid":"#ba55d3","mediumpurple":"#9370d8","mediumseagreen":"#3cb371","mediumslateblue":"#7b68ee","mediumspringgreen":"#00fa9a","mediumturquoise":"#48d1cc","mediumvioletred":"#c71585","midnightblue":"#191970","mintcream":"#f5fffa","mistyrose":"#ffe4e1","moccasin":"#ffe4b5","navajowhite":"#ffdead","navy":"#000080","oldlace":"#fdf5e6","olive":"#808000","olivedrab":"#6b8e23","orange":"#ffa500","orangered":"#ff4500","orchid":"#da70d6","palegoldenrod":"#eee8aa","palegreen":"#98fb98","paleturquoise":"#afeeee","palevioletred":"#d87093","papayawhip":"#ffefd5","peachpuff":"#ffdab9","peru":"#cd853f","pink":"#ffc0cb","plum":"#dda0dd","powderblue":"#b0e0e6","purple":"#800080","red":"#ff0000","rosybrown":"#bc8f8f","royalblue":"#4169e1","saddlebrown":"#8b4513","salmon":"#fa8072","sandybrown":"#f4a460","seagreen":"#2e8b57","seashell":"#fff5ee","sienna":"#a0522d","silver":"#c0c0c0","skyblue":"#87ceeb","slateblue":"#6a5acd","slategray":"#708090","snow":"#fffafa","springgreen":"#00ff7f","steelblue":"#4682b4","tan":"#d2b48c","teal":"#008080","thistle":"#d8bfd8","tomato":"#ff6347","turquoise":"#40e0d0","violet":"#ee82ee","wheat":"#f5deb3","white":"#ffffff","whitesmoke":"#f5f5f5","yellow":"#ffff00","yellowgreen":"#9acd32" 
    }; 

    if (typeof colors[color.toLowerCase()] != 'undefined') 
     return colors[color.toLowerCase()]; 

    return false; 
} 

function checkHex(color) { 
    return /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(color); 
} 

var color = color1.value; 

if (checkHex(color) || colorNameToHex(color)) { 
    ctx.fillStyle = color; 
} else { 
    ctx.fillStyle = "#000000"; 
} 
+0

большое спасибо, проблема в том, что я не могу создать другой функционал, мне нужно установить код в той же функции в> > function getPos (canvas, event) – NoWorries

+0

Должен работать, если вы копируете его в другую функцию, см .: http://jsfiddle.net/ChGxM/ – insertusernamehere

+0

YOU ÄR A FU *** GENUS, спасибо вам, человек сейчас работает ты очень :) – NoWorries

0

Если вы в состоянии получить введенный цветной текст, то сравните его с wi го ниже Формат-

var isValidColor = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test('Your color code here') 

для ПРИМЕР-

var isValidColor = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test('#aabbcc') 
+0

Я попробовал, но это все та же проблема :( – NoWorries

Смежные вопросы