HTML इनपुट value एट्रिब्यूट: फॉर्म फील्ड मान सेट और प्राप्त करना

HTML इनपुट value एट्रिब्यूट इनपुट एलिमेंट के मान को सेट या प्राप्त करने के लिए उपयोग किया जाता है। यह जावास्क्रिप्ट के माध्यम से फॉर्म फील्ड्स को डायनामिकली अपडेट करने के लिए आवश्यक है।

उदाहरण: URL फील्ड मान बदलना

<!DOCTYPE html>
<html>
<head>
  <title>इनपुट URL मान</title>
  <style>
    form { width: 70%; margin: 0 auto; text-align: center; }
    * { padding: 2px; margin: 5px; }
    input[type="button"] { border-radius: 10px; }
  </style>
</head>
<body>
  <form>
    <fieldset>
      <legend>URL-मान</legend>
      <label for="URLSelect">URL आईडी: 
        <input type="url" id="URLSelect">
        <input type="button" onclick="getUserURL('google')" value="Google">
        <input type="button" onclick="getUserURL('bing')" value="Bing"><br>
        <input type="button" onclick="redirection()" value="Go">
      </label>
      <div id="divDisplay"></div>
    </fieldset>
  </form>
  <script>
    var divDisplay = document.getElementById("divDisplay");
    var inputURL = document.getElementById("URLSelect");
    function getUserURL(userName) {
      if (userName === 'google')
        inputURL.value = 'https://www.google.com';
      else
        inputURL.value = 'https://www.bing.com';
    }
    function redirection() {
      if (inputURL.value !== '')
        divDisplay.textContent = 'रिडायरेक्ट हो रहा है ' + inputURL.value;
      else
        divDisplay.textContent = 'URL दर्ज करें';
    }
  </script>
</body>
</html>

आउटपुट परिदृश्य

1. खाली URL फील्ड के साथ 'Go' बटन क्लिक: "URL दर्ज करें"
2. 'Bing' बटन क्लिक करने के बाद: URL फील्ड में "https://www.bing.com" सेट हो जाता है
3. URL सेट होने के बाद 'Go' बटन क्लिक: "रिडायरेक्ट हो रहा है https://www.bing.com"

value प्रॉपर्टी के अन्य उपयोग

value vs defaultValue

• value: वर्तमान मान (यूज़र द्वारा बदला जा सकता है)
• defaultValue: मूल मान (HTML में सेट किया गया), रीसेट के लिए उपयोगी
• input.defaultValue केवल पढ़ने योग्य है (सीधे सेट नहीं किया जा सकता)