HTML DOM Input Color type Property

HTML DOM Input Color type property रंग इनपुट (type="color") के प्रकार को प्राप्त या सेट करता है। यह property इनपुट एलिमेंट के type attribute को दर्शाता है।

Syntax

प्रकार प्राप्त करना:

inputColorObject.type

प्रकार सेट करना:

inputColorObject.type = stringValue

String Values

stringValue	विवरण
color	यह परिभाषित करता है कि इनपुट प्रकार रंग पिकर है
radio	यह परिभाषित करता है कि इनपुट प्रकार रेडियो बटन है
text	यह परिभाषित करता है कि इनपुट प्रकार टेक्स्ट फील्ड है

उदाहरण

रंग पिकर को टेक्स्ट फील्ड में बदलना (डिफ़ॉल्ट रंग मान संरक्षित करते हुए):

<!DOCTYPE html>
<html>
<head>
<title>Input Color Type</title>
</head>
<body>
<form id="formForColorsInput">
  रंग पिकर: <input type="color" id="Color" name="primaryColor" value="#0000ff">
</form>
<button onclick="changeNameValue()">प्रकार प्राप्त करें और टेक्स्ट में बदलें</button>
<div id="divDisplay"></div>
<script>
  var inputColor = document.getElementById("Color");
  var divDisplay = document.getElementById("divDisplay");
  divDisplay.textContent = 'इनपुट का प्रकार: ' + inputColor.type;
  function changeNameValue() {
    if (inputColor.type == 'color') {
      var defaultColor = inputColor.defaultValue;
      inputColor.type = 'text';
      inputColor.value = defaultColor;
      divDisplay.textContent = 'रंग इनपुट का नाम: ' + inputColor.type;
    }
  }
</script>
</body>
</html>

आउटपुट

प्रारंभ में इनपुट का प्रकार "color" दिखाता है। "प्रकार प्राप्त करें और टेक्स्ट में बदलें" बटन क्लिक करने पर रंग पिकर टेक्स्ट फील्ड बन जाता है और हेक्स रंग कोड (#0000ff) टेक्स्ट के रूप में दिखाता है।

मुख्य बिंदु

type property इनपुट एलिमेंट के प्रकार को दर्शाता है
रंग इनपुट के लिए यह "color" लौटाता है
प्रकार बदलने से एलिमेंट का व्यवहार और UI पूरी तरह बदल जाता है
रनटाइम पर type बदलना दुर्लभ है - HTML में सही प्रकार सेट करना बेहतर है
रंग पिकर से टेक्स्ट में बदलने पर हेक्स कोड टेक्स्ट के रूप में दिखता है