<html>
<head>
<title>表单事件</title>
<style type="text/css">
input{
/*去掉输入框 默认蓝色边框*/
outline: none;
/*border-color: transparent;*/
}
</style>
</head>
<body>
<div>
<input type="text" name="">
</div>
</body>
<script type="text/javascript">
var inp=document.getElementsByTagName('input')[0];
//表单事件
//表单元素失去焦点是触发
inp.οnblur=function(){
//alert('失去焦点');
}
//表单获取焦点时
inp.οnfοcus=function(){
// alert('获取焦点');
inp.style.borderColor="red";
inp.style.borderColor="yellow";
}
//表单内容发生改变 并失去焦点时触发
inp.οnchange=function(){
//表单里面
inp.style.backgroundColor='pink';
}
//表单内容改变时 实时触发
inp.οninput=function(){
inp.style.backgroundColor='yellow';
console.log('表单内容已改变');
}
</script>
</html>