In JavaScript many types of events, onchange, onclick, onmouseover, onmouseout, onkeydown, onload, onblur, ondrop, onfocus, etc.
Onclick event
This is most frequently used event type which occur when a user click the button of his mouse.
JavaScript.js
function changeColor() {
var name = window.document.getElementById('color');
alert('Your selected color is : ' + name.value);
name.style.backgroundColor = name.value;
window.document.body.style.backgroundColor = name.value;
}
Some.html
<!DOCTYPE html>
<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta charset='utf-8' />
<title>JS Demo</title>
<style type='text/css'>
* {
margin:10px;
padding:0px;
}
select {
width:100px;
}
</style>
<script src='JavaScript.js' type='text/javascript'></script>
</head>
<body>
<span>Select Color name : </span>
<select name='color' id='color' >
<option value='red'>Red</option>
<option value='yellow'>Yellow</option>
<option value='white'>White</option>
<option value='pink'>Pink</option>
<option value='green'>Green</option>
</select>
<button type='button' onclick='changeColor()' value=' Submit '> Submit </button>
</body>
</html>
