checkbox value code example

Example 1: input checkbox

<div>
  <input type="checkbox" id="scales" name="scales"
         checked>
  <label for="scales">Scales</label>
</div>

<div>
  <input type="checkbox" id="horns" name="horns">
  <label for="horns">Horns</label>
</div>

Example 2: commande checkbox html

<!doctype html>
<html>
  <body>
    
    <input type="checkbox">
    <input type="radio">
    
  </body>
</html>

Example 3: checkbox value

<input type="checkbox" name="vehicle1" value="Bike">

The checkbox value is 'Bike'.

Example 4: value in checkbox

<form>
  <div>
    <input type="checkbox" id="subscribeNews" name="subscribe" value="newsletter">
    <label for="subscribeNews">Subscribe to newsletter?</label>
  </div>
  <div>
    <button type="submit">Subscribe</button>
  </div>
</form>

Example 5: get checkbox value in div TAG

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="cs-input"></div>
<div id="CS-popup" class="popup-windows ">
  <label>
    <input type="checkbox" name="CS" value="GMSC01" />GMSC01
  </label>
  <label>
   <input type="checkbox" name="CS" value="GMSC02" data-selector="GMSC02BOX" />GMSC02
  </label>
  <label>
   <input type="checkbox" name="CS" value="VMSC01" data-selector="VMSC01BOX" />VMSC01
  </label><br />
  
  <label>
   <input type="checkbox" name="CS" value="VMSC02" data-selector="VMSC02BOX" />VMSC02
  </label>
  <label>
   <input type="checkbox" name="CS" value="GMGW01" data-selector="GMGW01BOX" />GMGW01
  </label>
  <label>
    <input type="checkbox" name="CS" value="GMGW02" data-selector="GMGW02BOX" />GMGW02
  </label><br />
  
  <label>
   <input type="checkbox" name="CS" value="VMGW01" data-selector="VMGW01BOX" />VMGW01
  </label>
  <label>
  <input type="checkbox" name="CS" value="VMGW02" data-selector="VMGW02BOX" />VMGW02
  </label>
  <label>
  <input type="checkbox" name="CS" value="SPS01" data-selector="SPS01BOX" />SPS01
  </label><br />

  <label>
   <input type="checkbox" name="CS" value="SPS02" data-selector="SPS02BOX" />SPS02
  </label>
  <label>
    <input type="checkbox" name="CS" value="HSS01" data-selector="HSS01BOX" />HSS01
  </label>
  <label>
    <input type="checkbox" name="CS" value="HSS02" data-selector="HSS02BOX" />HSS02
  </label><br />
</div>

Tags:

Html Example

Recent Posts