HTML DOM इनपुट सर्च डिफॉल्टवैल्यू प्रॉपर्टी का इस्तेमाल सर्च फील्ड के डिफॉल्ट वैल्यू को सेट करने या प्राप्त करने के लिए किया जाता है। किसी तत्व का डिफ़ॉल्ट मान वह मान है जो मान विशेषता को सौंपा गया है। वैल्यू और डिफॉल्टवैल्यू प्रॉपर्टी के बीच का अंतर यह है कि डिफॉल्टवैल्यू प्रॉपर्टी मूल डिफॉल्ट वैल्यू को बरकरार रखती है जबकि वैल्यू प्रॉपर्टी वैल्यू सर्च फील्ड में यूजर इनपुट के आधार पर बदल जाती है।
सिंटैक्स
डिफॉल्टवैल्यू प्रॉपर्टी सेट करने के लिए सिंटैक्स निम्नलिखित है -
searchObject.defaultValue = value
यहाँ, “मान” खोज फ़ील्ड का डिफ़ॉल्ट मान है।
उदाहरण
आइए Search defaultValue प्रॉपर्टी के लिए एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<body>
<h1>Input Search defaultValue Property</h1>
<form>
FRUITS: <input type="search" id="SEARCH1" name="fruits" value="MANGO">
</form>
<p>Change the above search field default value by clicking on the CHANGE button</p>
<button type="button" onclick="changeDefault()">CHANGE</button>
<p id="Sample"></p>
<script>
function changeDefault() {
document.getElementById("SEARCH1").defaultValue="APPLE";
var P=document.getElementById("SEARCH1").defaultValue;
document.getElementById("Sample").innerHTML = "Default value has been changed from MANGO to "+P ;
}
</script>
</body>
</html> आउटपुट
यह निम्नलिखित आउटपुट देगा -
चेंज बटन पर क्लिक करने पर -
उपरोक्त उदाहरण में -
हमने सबसे पहले टाइप ="सर्च", आईडी ="सर्च 1", नाम ="फ्रूट्स" के साथ एक <इनपुट> एलिमेंट बनाया है और इसकी वैल्यू एट्रीब्यूट "मैंगो" पर सेट है। खोज फ़ील्ड एक प्रपत्र के अंदर है -
<form> FRUITS: <input type="search" id="SEARCH1" name="fruits" value="MANGO"> </form>
फिर हम एक बटन चेंज बनाते हैं जो उपयोगकर्ता द्वारा क्लिक किए जाने पर चेंजडिफॉल्ट () विधि को निष्पादित करेगा -
<button type="button" onclick="changeDefault()">CHANGE</button>
चेंजडिफॉल्ट () विधि टाइप खोज के साथ इनपुट फ़ील्ड प्राप्त करने के लिए getElementById () विधि का उपयोग करती है और इसकी डिफ़ॉल्ट वैल्यू संपत्ति को "एप्पल" पर सेट करती है। फिर हम getElementById() विधि का उपयोग करके फिर से टाइप सर्च के साथ इनपुट की डिफ़ॉल्ट वैल्यू प्रॉपर्टी प्राप्त करते हैं और इसे वेरिएबल पी को असाइन करते हैं। इस वेरिएबल को पैराग्राफ की आंतरिक HTML प्रॉपर्टी का उपयोग करके आईडी "नमूना" के साथ पैराग्राफ में प्रदर्शित किया जाता है -
function changeDefault() {
document.getElementById("SEARCH1").defaultValue="APPLE";
var P=document.getElementById("SEARCH1").defaultValue;
document.getElementById("Sample").innerHTML = "Default value has been changed from MANGO to "+P ;
} में बदल दिया गया है)