HTML DOM Input Range disabled प्रॉपर्टी

HTML DOM Input Range disabled प्रॉपर्टी का उपयोग यह सेट या प्राप्त करने के लिए किया जाता है कि रेंज स्लाइडर डिसेबल होना चाहिए या नहीं। यह बूलियन मानों का उपयोग करता है जिसमें true दर्शाता है कि रेंज स्लाइडर डिसेबल होना चाहिए और false अन्यथा। Disabled प्रॉपर्टी डिफ़ॉल्ट रूप से false पर सेट होती है। हालांकि, डिसेबल एलिमेंट डिफ़ॉल्ट रूप से ग्रे आउट होता है और अनक्लिकेबल होता है।

सिंटैक्स

Disabled प्रॉपर्टी सेट करने के लिए सिंटैक्स:

rangeObject.disabled = true|false;

यहां, true=रेंज स्लाइडर डिसेबल है और false=रेंज स्लाइडर डिसेबल नहीं है। यह डिफ़ॉल्ट रूप से false है।

उदाहरण

Input range disabled प्रॉपर्टी का एक उदाहरण:

<!DOCTYPE html> <html> <body> <h1>Input range disabled प्रॉपर्टी</h1> <form> <input type="range" id="RANGE1" name="VOL"> </form> <p>ऊपर दिए गए DISABLE बटन पर क्लिक करके रेंज स्लाइडर को डिसेबल करें</p> <button type="button" onclick="disableRange()">डिसेबल</button> <p id="Sample"></p> <script>    function disableRange() {       document.getElementById("RANGE1").disabled=true;       document.getElementById("Sample").innerHTML = "रेंज स्लाइडर अब डिसेबल है" ;    } </script> </body> </html>

आउटपुट

उपरोक्त कोड से निम्न आउटपुट प्राप्त होगा:

HTML DOM Input Range disabled प्रॉपर्टी

"डिसेबल" बटन पर क्लिक करने पर, अब आप स्लाइडर को मूव नहीं कर सकते:

HTML DOM Input Range disabled प्रॉपर्टी

उपरोक्त उदाहरण में:

हमने type="range", id="RANGE1", name="VOL" के साथ एक फॉर्म के अंदर एक इनपुट फील्ड बनाया:

<form> <input type="range" id="RANGE1" name="VOL"> </form>

फिर हमने एक बटन DISABLE बनाया जो यूज़र द्वारा क्लिक किए जाने पर disableRange() मेथड को एक्जीक्यूट करेगा:

<button type="button" onclick="disableRange()">DISABLE</button>

disableRange() मेथड getElementById() मेथड का उपयोग करके टाइप range वाले इनपुट एलिमेंट को प्राप्त करता है और इसकी disabled प्रॉपर्टी को true पर सेट करता है। यह रेंज स्लाइडर को अनमूवेबल बना देता है और यूज़र अब इसके साथ इंटरैक्ट नहीं कर सकता। स्लाइडर अब फिक्स है:

function disableRange() {    document.getElementById("RANGE1").disabled=true;    document.getElementById("Sample").innerHTML = "रेंज स्लाइडर अब डिसेबल है" ; }