HTML DOM इनपुट मंथ readOnly प्रॉपर्टी

परिचय

HTML DOM इनपुट मंथ readOnly प्रॉपर्टी HTML दस्तावेज़ में इनपुट मंथ फील्ड के रीड-ओनली होने या न होने का मान प्राप्त करती है और संशोधित करती है। रीड-ओनली फील्ड में यूज़र मान नहीं बदल सकता।

सिंटैक्स

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

object.readOnly

मान सेट करना

object.readOnly = 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;
    height: 100%;
  }
  p { font-weight: 700; font-size: 1.1rem; }
  input {
    display: block;
    width: 35%;
    border: 2px solid #fff;
    background-color: transparent;
    color: #fff;
    font-weight: bold;
    padding: 8px;
    margin: 1rem auto;
  }
  .btn {
    background: #0197F6;
    border: none;
    height: 2rem;
    border-radius: 2px;
    width: 35%;
    margin: 2rem auto;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
  }
</style>
</head>
<body>
<h1>DOM इनपुट मंथ readOnly प्रॉपर्टी डेमो</h1>
<p>हाय, अपनी जन्म तिथि का महीना चुनें?</p>
<input type="month" class="monthInput">
<button onclick="rFunction()" class="btn">रीड ओनली</button>
<button onclick="rWFunction()" class="btn">रीड एंड राइट</button>
<script>
  function rFunction() {
    var monthInput = document.querySelector(".monthInput");
    monthInput.readOnly = true;
  }
  function rWFunction() {
    var monthInput = document.querySelector(".monthInput");
    monthInput.readOnly = false;
  }
</script>
</body>
</html>

आउटपुट

महीना चुनने के बाद "रीड ओनली" पर क्लिक करें - चयन बदल नहीं पाएंगे। फिर "रीड एंड राइट" पर क्लिक करके फिर से संपादन सक्षम करें।