click event

by haba713

HTML

<a href="javascript:go('a href');">a href</a>
 &nbsp;
<a href="#" onclick="go('a onclick');">a onclick</a>
 &nbsp;
<a href="#" id="ajq">a jq click</a>
 &nbsp;
<button id="btn" onclick="timeout();">20 s timeout</button>
<p id="log">
</p>

CSS

a {
  font-size: 1.1em;
  background-color: green;
  border: 4px solid green;
  text-decoration: none;
  color: white;
}
p {
  font-size: 0.8em;
}

JavaScript

function go(str) {
	var p = $('#log');
	p.append(document.createTextNode(str));
  p.append(document.createElement('br'));
}
function timeout() {
	window.setTimeout(function() {
  	go('--- 20 s timeout over ---');
    $('#btn').prop('disabled', false);
  }, 20000);
  $('#btn').prop('disabled', true);
  go('--- start 20 s timeout ---');
}
$(document).ready(function() {
	$('#ajq').click(function() {
  	go('a jq click');
  });
});