एचटीएमएल डोम बटन प्रकार की संपत्ति एचटीएमएल <बटन> तत्व से जुड़ी है। डिफ़ॉल्ट रूप से बटन तत्व में टाइप =“सबमिट” होता है यानी फॉर्म के किसी भी बटन पर क्लिक करने से फॉर्म जमा हो जाएगा। बटन प्रकार गुण सेट करता है या बटन का प्रकार लौटाता है।
सिंटैक्स
−
. के लिए वाक्य रचना निम्नलिखित हैबटन टाइप प्रॉपर्टी सेट करना -
buttonObject.type = "submit|button|reset"
यहां, सबमिट | बटन | रीसेट बटन प्रकार मान हैं। सबमिट डिफ़ॉल्ट रूप से सेट है।
- सबमिट करें - बटन को सबमिट बटन बनाता है।
- बटन - एक सामान्य क्लिक करने योग्य बटन बनाता है।
- रीसेट करें - एक रीसेट बटन बनाता है जो फ़ॉर्म डेटा को रीसेट करता है।
उदाहरण
आइए HTML DOM बटन टाइप प्रॉपर्टी का एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<body>
<form id="Form1" action="/sample.php">
<label>First Name: <input type="text" name="fname"><br><br></label>
<label>Surname: <input type="text" name="lname"><br><br></label>
<button id="Button1" type="submit">Submit</button>
</form>
<p>Click the below button below to change the type of the above button from "submit" to "reset".</p>
<button onclick="changeType()">CHANGE</button>
<p id="Sample"></p>
<script>
function changeType() {
document.getElementById("Button1").type = "reset";
document.getElementById("Sample").innerHTML = "The Submit button is now a reset
button";
}
</script>
</body>
</html> आउटपुट
यह निम्नलिखित आउटपुट उत्पन्न करेगा -
विवरण भरने और चेंज पर क्लिक करने पर -
अब सबमिट पर क्लिक करें (जो अब रीसेट हो गया है) -
उपरोक्त उदाहरण में -
हमने पहले दो टेक्स्ट फ़ील्ड और "सबमिट" प्रकार वाला एक बटन बनाया है जो हमारा डेटा सबमिट करेगा -
<label>First Name: <input type="text" name="fname"><br><br></label> <label>Surname: <input type="text" name="lname"><br><br></label> <button id="Button1" type="submit">Submit</button>
हमने तब चेंज बटन बनाया है जो क्लिक पर चेंज टाइप () विधि को निष्पादित करेगा -
<button onclick="changeType()">CHANGE</button>
चेंज टाइप () विधि अपनी आईडी का उपयोग करके बटन तत्व प्राप्त करती है और इसके प्रकार को रीसेट करने के लिए सेट करती है। फिर परिवर्तन के बारे में संदेश "आईडी" नमूने के साथ पैराग्राफ में परिलक्षित होता है। अब जब आप सबमिट बटन पर क्लिक करेंगे तो यह रीसेट हो जाएगा यानी फॉर्म डेटा को सबमिट करने के बजाय साफ़ कर देगा -
function changeType() {
document.getElementById("Button1").type = "reset";
document.getElementById("Sample").innerHTML = "The Submit button is now a reset button";
}