Javascript 基礎(chǔ)教程之事件
下面我們來(lái)看以下常見的事件
onchange 改變事件
實(shí)例，代碼如下，當(dāng)在文本框輸入小寫字母時(shí)，鼠標(biāo)離開文本框，變成大寫字母
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
<script type="text/javascript">
function cha(){
var x=document.getElementById("name");
x.value=x.value.toUpperCase();
}
</script>
</head>
<body>
請(qǐng)輸入：<input type="text" id="name" onchange="cha()">
</body>
</html>onclick 點(diǎn)擊事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
<script type="text/javascript">
function cl(){
alert("php中文網(wǎng)");
}
</script>
</head>
<body>
<input type="button" value="點(diǎn)擊" onclick="cl()">
</body>
</html>onmouseover 和 onmouseout 事件
實(shí)例, 我們做一個(gè)例子，鼠標(biāo)放上去，出現(xiàn)，歡迎來(lái)到php中文網(wǎng) 當(dāng)鼠標(biāo)離開時(shí)，文字變成 php中文網(wǎng)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
<style type="text/css">
#dv{
width:200px;height:200px;border:1px solid #f60;background-color: red;
text-align: center;line-height:200px;
}
</style>
</head>
<body>
<div id="dv" onmouseover="over(this)" onmouseout="out(this)"></div>
<script type="text/javascript">
function over(obj){
obj.innerHTML = "歡迎來(lái)到php中文網(wǎng)"; //鼠標(biāo)放上去時(shí)
}
function out(obj){
obj.innerHTML = "php中文網(wǎng)"; // 鼠標(biāo)離開后
}
</script>
</body>
</html>onkeydown 鍵盤事件
現(xiàn)在我們來(lái)做一個(gè)例子，在文本框中，我們按下鍵盤，彈出一個(gè)提示窗口
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
<script type="text/javascript">
function onkey(){
alert("您已觸發(fā)鍵盤事件");
}
</script>
</head>
<body>
鍵盤事件：<input type="text" onkeydown="onkey()">
</body>
</html>onload 加載事件
下面我們寫一個(gè)實(shí)例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>事件</title>
<script type="text/javascript">
function checkCookies(){
if (navigator.cookieEnabled==true){
alert("Cookies 可用")
}else{
alert("Cookies 不可用")
}
}
</script>
</head>
<body onload="checkCookies()">
php 中文網(wǎng)
</body>
</html>
