uicoded/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="description" content="HTML - input type checkbox disabled">
  <title>HTML - input type checkbox disabled</title>
<style id="jsbin-css">
fieldset{
  margin: 2em 0;
}
button{
  cursor: pointer;
}
</style>
</head>
<body>
  <h1>HTML - input type checkbox disabled</h1>

  <form action="">
    <label for="standalone">Standalone disabled checkbox</label><input id="standalone" type="checkbox" disabled>
    <p><button id="flip">enable</button></p>
    <fieldset>
      <legend>Checkbox group</legend>
    </fieldset>


  </form>

<script id="jsbin-javascript">
var ch1 = document.getElementById('standalone'),
    flipButton = document.getElementById('flip');

flipButton.onclick = function (){
  if(ch1.disabled){
    ch1.disabled = false;
    this.value = 'disable';
  }else{
    ch1.disabled = true;
    this.value = 'enable';
  }
  return false;
}
</script>


<script id="jsbin-source-css" type="text/css">fieldset{
  margin: 2em 0;
}
button{
  cursor: pointer;
}</script>

<script id="jsbin-source-javascript" type="text/javascript">var ch1 = document.getElementById('standalone'),
    flipButton = document.getElementById('flip');

flipButton.onclick = function (){
  if(ch1.disabled){
    ch1.disabled = false;
    this.value = 'disable';
  }else{
    ch1.disabled = true;
    this.value = 'enable';
  }
  return false;
}
</script></body>
</html>

## jsbin.boqeko.css
fieldset{
  margin: 2em 0;
}
button{
  cursor: pointer;
}

## jsbin.boqeko.js
var ch1 = document.getElementById('standalone'),
    flipButton = document.getElementById('flip');

flipButton.onclick = function (){
  if(ch1.disabled){
    ch1.disabled = false;
    this.value = 'disable';
  }else{
    ch1.disabled = true;
    this.value = 'enable';
  }
  return false;
}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="description" content="HTML - input type checkbox disabled">
	<title>HTML - input type checkbox disabled</title>
	<style id="jsbin-css">
	fieldset{
	margin: 2em 0;
	}
	button{
	cursor: pointer;
	}
	</style>
	</head>
	<body>
	<h1>HTML - input type checkbox disabled</h1>

	<form action="">
	<label for="standalone">Standalone disabled checkbox</label><input id="standalone" type="checkbox" disabled>
	<p><button id="flip">enable</button></p>
	<fieldset>
	<legend>Checkbox group</legend>
	</fieldset>


	</form>

	<script id="jsbin-javascript">
	var ch1 = document.getElementById('standalone'),
	flipButton = document.getElementById('flip');

	flipButton.onclick = function (){
	if(ch1.disabled){
	ch1.disabled = false;
	this.value = 'disable';
	}else{
	ch1.disabled = true;
	this.value = 'enable';
	}
	return false;
	}
	</script>


	<script id="jsbin-source-css" type="text/css">fieldset{
	margin: 2em 0;
	}
	button{
	cursor: pointer;
	}</script>

	<script id="jsbin-source-javascript" type="text/javascript">var ch1 = document.getElementById('standalone'),
	flipButton = document.getElementById('flip');

	flipButton.onclick = function (){
	if(ch1.disabled){
	ch1.disabled = false;
	this.value = 'disable';
	}else{
	ch1.disabled = true;
	this.value = 'enable';
	}
	return false;
	}
	</script></body>
	</html>