Teach with us

HTML DOM Input Checkbox type Property

HTMLWeb DevelopmentFront End Technology

The Input Checkbox type property returns/sets type of Input Checkbox.

Syntax

Following is the syntax −

  • Returning string value
inputCheckboxObject.type
  • Setting type to string value
inputCheckboxObject.type = stringValue

String Values

Here, “stringValue” can be the following -

stringValueDetails
checkboxIt defines that input type is checkbox
radioIt defines that input type is radio
textIt defines that input type is text

Example

Let us see an example of Input Checkbox type property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Type Attribute of Checkbox</title>
</head>
<body>
<form id="Form">
<div>
Other: <input id="formCheckbox" type="checkbox" name="formCheckbox">
</div>
</form>
<button onclick="changeType()">Change type of input</button>
<div id="displayDiv"></div>
<script>
   var typeOfInput = document.getElementById("formCheckbox");
   var displayDiv = document.getElementById("displayDiv");
   displayDiv.textContent = 'Type of Input: ' + typeOfInput.type function changeType(){
      if(typeOfInput.type == 'checkbox'){
         typeOfInput.type = 'text' displayDiv.textContent = 'Type of Input: ' + typeOfInput.type
      }
   }
</script>
</body>
</html>

Output

This will produce the following output −

Before clicking ‘Change type of input’ button −

After clicking ‘Change type of input’ button −

raja
Kumar Varma
Updated on 30-Jul-2019 22:30:26

Previous Page Print Page Next Page  
Advertisements