HTML DOM इनपुट नंबर disabled प्रॉपर्टी

परिचय

HTML DOM इनपुट नंबर disabled प्रॉपर्टी HTML दस्तावेज़ में type="number" वाले इनपुट फील्ड के अक्षम होने या न होने का मान प्राप्त करती है और संशोधित करती है।

सिंटैक्स

मान प्राप्त करना

object.disabled

मान सेट करना

object.disabled = true | false

उदाहरण

नंबर इनपुट फील्ड को सक्षम/अक्षम करने के लिए टॉगल:

<!DOCTYPE html>
<html>
<head>
<style>
  html { height: 100%; }
  body {
    text-align: center;
    color: #fff;
    background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
    background: #B39CD0;
    height: 100%;
  }
  p { font-weight: 700; font-size: 1.2rem; }
  input {
    width: 35%;
    border: 2px solid #fff;
    background-color: transparent;
    color: #fff;
    font-weight: bold;
    padding: 8px;
    outline: none;
  }
  .btn {
    background: #008B74;
    border: none;
    height: 2rem;
    border-radius: 2px;
    width: 35%;
    margin: 2rem auto;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
  }
  .show { font-size: 1.5rem; font-weight: bold; }
</style>
</head>
<body>
<h1>DOM इनपुट नंबर disabled उदाहरण</h1>
<p>हाय, अपनी जन्म तिथि का दिन दर्ज करें</p>
<input type="number" class="numberInput">
<button onclick="disEna()" class="btn">अक्षम/सक्षम करें</button>
<div class="show"></div>
<script>
  function disEna() {
    var monthInput = document.querySelector(".numberInput");
    var showMsg = document.querySelector(".show");
    showMsg.innerHTML = "";
    if (monthInput.disabled === true) {
      monthInput.disabled = false;
      showMsg.innerHTML = "पहले, मैं अक्षम था लेकिन अब मैं सक्षम हूँ!";
    } else {
      monthInput.disabled = true;
      showMsg.innerHTML = "पहले, मैं सक्षम था लेकिन अब मैं अक्षम हूँ!";
    }
  }
</script>
</body>
</html>

आउटपुट

"अक्षम/सक्षम करें" बटन पर क्लिक करके पहले नंबर इनपुट फील्ड को अक्षम करें, फिर से क्लिक करके सक्षम करें।