উত্তর:
/^#[0-9A-F]{6}$/i.test('#AABBCC')
সম্প্রসারিত:
^ ->0 থেকে 9
# ->অবধি
[0-9A-F] ->কোনও পূর্ণসংখ্যার সাথে হ্যাশ শুরু করুন এবং
{6} ->পূর্ববর্তী গ্রুপে এ থেকে এফ থেকে যে কোনও চিঠি উপস্থিত হবে ঠিক 6 বার
$ ->ম্যাচ শেষ
i ->উপেক্ষা কেস
আপনার যদি 3-অক্ষরের এইচএক্স কোডগুলির জন্য সমর্থন প্রয়োজন হয় তবে নিম্নলিখিতগুলি ব্যবহার করুন:
/^#([0-9A-F]{3}){1,2}$/i.test('#ABC')
এখানে কেবল পার্থক্য
[0-9A-F]{6}
সঙ্গে প্রতিস্থাপন করা হয়
([0-9A-F]{3}){1,2}
এর অর্থ হ'ল ঠিক characters টি অক্ষরের সাথে মিলে না গিয়ে এটি ঠিক 3 টি অক্ষর, তবে 1 বা 2 বারের সাথে মিলবে। মঞ্জুরি দিচ্ছে ABCএবং AABBCCতবে তা নয়ABCD
color: #f00;পাশাপাশি লাল (# ff0000) হিসাবে ব্যাখ্যা করা হবে।
/^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test("#f00")
/^#([0-9a-f]{3}){1,2}$/iমিশ্রণ যোগ করতে হবে ।
/^#[0-9A-F]{3,6}$/i.test('#aabb')পাস করে তবে #aabbএকটি বৈধ হেক্স রঙ নয়।
// regular function
function isHexColor (hex) {
return typeof hex === 'string'
&& hex.length === 6
&& !isNaN(Number('0x' + hex))
}
// or as arrow function (ES6+)
isHexColor = hex => typeof hex === 'string' && hex.length === 6 && !isNaN(Number('0x' + hex))
console.log(isHexColor('AABBCC')) // true
console.log(isHexColor('AABBCC11')) // false
console.log(isHexColor('XXBBCC')) // false
console.log(isHexColor('AAXXCC')) // false
এই উত্তরটি মিথ্যা পজিটিভ ফেলেছিল কারণ পরিবর্তে Number('0x' + hex)এটি ব্যবহার করেছে parseInt(hex, 16)। parseInt()স্ট্রিংয়ের শুরু থেকে বিশ্লেষণ করবে যতক্ষণ না এটি এমন কোনও চরিত্রের কাছে পৌঁছায় যা Radix ( 16) এ অন্তর্ভুক্ত থাকে না । এর অর্থ এটি 'AAXXCC' এর মতো স্ট্রিংগুলি বিশ্লেষণ করতে পারে কারণ এটি 'এএ' দিয়ে শুরু হয় with
Number()অন্যদিকে, পুরো স্ট্রিংটি মূল্যের সাথে মেলে তবেই পার্স করবে। এখন, Number()কোনও রেডিক্স প্যারামিটার নেয় না, তবে ভাগ্যক্রমে, আপনি অন্যান্য রেডিয়ায় একটি নম্বর পেতে সংখ্যার অক্ষরগুলিকে উপসর্গ করতে পারেন।
এখানে স্পষ্টতার জন্য একটি টেবিল রয়েছে:
╭─────────────┬────────────┬────────┬───────────────────╮
│ Radix │ Characters │ Prefix │ Will output 27 │
╞═════════════╪════════════╪════════╪═══════════════════╡
│ Binary │ 0-1 │ 0b │ Number('0b11011') │
│ Octal │ 0-7 │ 0o │ Number('0o33') │
│ Decimal │ 0-9 │ - │ - │
│ Hexadecimal │ 0-9A-F │ 0x │ Number('0x1b') │
╰─────────────┴────────────┴────────┴───────────────────╯
parseIntনেবে "abcZab", এটি "Z"অবৈধ (মূল ১ 16 এর জন্য) খুঁজে পাবে এবং এটি এবং এর পরে যে কোনও কিছু উপেক্ষা করবে। এরপরে এটি সূচনা নেয় "abc"এবং এটিকে রূপান্তর করে 2748( parseInt("abcZab", 16)এটি এর যুক্তি যা ঘটছে তা প্রমাণ করে)। নামটি বোঝা যায়, একটি স্ট্রিংকে parseInt বিশ্লেষণ করে । আপনি যদি 10 এর মূল্যের সাথে এর এককগুলির সাথে একটি সংখ্যা পার্স করে চলেছিলেন ঠিক তেমন parseInt("10px", 10), আপনি পেয়ে যাবেন 10। আপনি এখানে বর্ণিত এটি দেখতে পারেন: es5.github.io/#x15.1.2.2 (পদক্ষেপ 11)
এটি একটি জটিল সমস্যা হতে পারে। বেশ কয়েকটি চেষ্টার পরে আমি বেশ পরিষ্কার সমাধান নিয়ে এসেছি। ব্রাউজারটি আপনার জন্য কাজটি করতে দিন।
পদক্ষেপ 1: সীমানা-শৈলীর সাথে সেট না করে একটি ডিভ তৈরি করুন। ডিভি স্ক্রিনের বাইরে অবস্থান করা যেতে পারে বা এটি আপনার পৃষ্ঠায় কোনও ডিভ হতে পারে যা সীমানা ব্যবহার করে না।
পদক্ষেপ 2: একটি খালি স্ট্রিংয়ের সীমানার রঙ সেট করুন। কোডটি এর মতো দেখতে পারে:
e=document.getElementbyId('mydiv');
e.style.borderColor="";
পদক্ষেপ 3: আপনি যে রঙ সম্পর্কে নিশ্চিত নন সেটিতে সীমানার রঙ সেট করুন।
e.style.borderColor=testcol;
পদক্ষেপ 4: রঙটি আসলে পরিবর্তিত হয়েছে কিনা তা পরীক্ষা করে দেখুন। যদি টেস্টকোলটি অবৈধ হয় তবে কোনও পরিবর্তন আসবে না।
col2=e.style.borderColor;
if(col2.length==0) {alert("Bad Color!");}
পদক্ষেপ 5: খালি স্ট্রিংটিতে রঙ সেট করে নিজের পরে পরিষ্কার করুন।
e.style.borderColor="";
ডিভ:
<div id="mydiv" style="border-style:none; position:absolute; left:-9999px; top:-9999px;"></div>
এখন জাভাস্ক্রিপ্ট ফাংশন:
function GoodColor(color)
{
var color2="";
var result=true;
var e=document.getElementById('mydiv');
e.style.borderColor="";
e.style.borderColor=color;
color2=e.style.borderColor;
if (color2.length==0){result=false;}
e.style.borderColor="";
return result;
}
এই ক্ষেত্রে, ফাংশনটি প্রশ্নের সত্য / মিথ্যা উত্তর ফিরিয়ে দিচ্ছে, অন্য বিকল্পটি এটির জন্য একটি বৈধ রঙের মান ফিরিয়ে আনতে হবে। আপনার আসল রঙ মান, সীমানা রঙের মান বা অবৈধ রঙের জায়গায় একটি খালি স্ট্রিং।
আপনি যদি এইচটিএমএলে এটি ব্যবহার করার চেষ্টা করছেন তবে এই প্যাটার্নটি সরাসরি ব্যবহার করার চেষ্টা করুন:
pattern="^#+([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$"
মত
<input id="hex" type="text" pattern="^#+([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$" />
এটি অনুরোধ করা ফর্ম্যাটটি মেলে একটি বৈধতা দেবে।
function validColor(color){
var $div = $("<div>");
$div.css("border", "1px solid "+color);
return ($div.css("border-color")!="")
}
https://gist.github.com/dustinpoissant/22ce25c9e536bb2c5a2a363601ba261c
দ্রষ্টব্য: এর জন্য jQuery প্রয়োজন
এটি হেক্স মানগুলির জন্য নয় সমস্ত রঙের ধরণের জন্য কাজ করে । এটি ডিওএম গাছে অপ্রয়োজনীয় উপাদান যুক্ত করে না ।
যদি কোনও রঙের বৈধতা আছে কিনা তা জানানোর জন্য যদি আপনার কোনও ফাংশন প্রয়োজন হয় তবে আপনাকে সেই রঙের গণিত মানগুলি - এবং এটি কোনও বৈধ রঙ না হলে শূন্য ফিরে আসতে পারে useful যে কোনও ফরমেটে "রঙ" এর আরজিবিএ মানগুলি পেতে - এটি 'সবুজ', বা '# এফএফএফ', বা '# 89abcd', বা 'আরজিবি'র জন্য সামঞ্জস্যপূর্ণ (Chrome54 & MSIE11) ফাংশনে আমার ছুরিকাঘাত (0,0,128) ', বা' আরজিবা (0, 128, 255, 0.5) '।
/* getRGBA:
Get the RGBA values of a color.
If input is not a color, returns NULL, else returns an array of 4 values:
red (0-255), green (0-255), blue (0-255), alpha (0-1)
*/
function getRGBA(value) {
// get/create a 0 pixel element at the end of the document, to use to test properties against the client browser
var e = document.getElementById('test_style_element');
if (e == null) {
e = document.createElement('span');
e.id = 'test_style_element';
e.style.width = 0;
e.style.height = 0;
e.style.borderWidth = 0;
document.body.appendChild(e);
}
// use the browser to get the computed value of the input
e.style.borderColor = '';
e.style.borderColor = value;
if (e.style.borderColor == '') return null;
var computedStyle = window.getComputedStyle(e);
var c
if (typeof computedStyle.borderBottomColor != 'undefined') {
// as always, MSIE has to make life difficult
c = window.getComputedStyle(e).borderBottomColor;
} else {
c = window.getComputedStyle(e).borderColor;
}
var numbersAndCommas = c.replace(new RegExp('[^0-9.,]+','g'),'');
var values = numbersAndCommas.split(',');
for (var i = 0; i < values.length; i++)
values[i] = Number(values[i]);
if (values.length == 3) values.push(1);
return values;
}
আপনি কোনও মিথ্যা ধনাত্মক না পেয়ে তা নিশ্চিত করতে একটি দৈর্ঘ্যের চেক যুক্ত করুন
function isValidHex(testNum){
let validHex = false;
let numLength = testNum.length;
let parsedNum = parseInt(testNum, 16);
if(!isNan(parsedNum) && parsedNum.length===numLength){
validHex = true;
}
return validHex;
}
AARRGGBBফর্ম্যাটটিতে আলফা অন্তর্ভুক্ত থাকে ।