事件笔记案例全

来源：互联网发布：永宏b1编程电缆编辑：程序博客网时间：2024/04/27 16:00

1，总结笔记

一般事件：

在dom中，属性的样式是驼峰法，跟style中的样式不一样，例如：在dom中，backgroundColor 在

style中background-color等

      onfocus :获得焦点。在光标停留在文本框时，响应一个函数。

      onblur：失去焦点。在光标离开文本框时，响应一个函数。
      function clearInput(){
   //获得输入框的值
   var username = document.getElementById("username");
   username.value = '';
  }
  function getInput(){
   //获得输入框的值
   var username = document.getElementById("username");
   username.value = '请输入用户名';
  }

onchange：用在下拉列表中一般，选择下拉列表中的值等。

onload：onload事件是整个文档（body）都被加载完之后才触发的事件。

setInterval和setTimeout的区别：

setTimeout()多少秒之后执行某个函数就执行一次。

        setInterval()没隔多少秒执行某个函数，一直执行。

        var str = "欢迎来到我的空间";
  function Move(){
   //alert(str.substr(1));
   //如何截取第一个字符
   //alert(str.charAt(0));
   str = str.substr(1)+str.charAt(0);
   window.status = str;
   document.title = str;
   setTimeout("Move()",500);
  }
   //setInterval("Move()",500);

二、鼠标事件

移出鼠标：onmouseover

移入鼠标：onmouseout

onmousemove 鼠标移动获得坐标

onclick 点击是响应一个事件

onmouseup 鼠标抬起来的时候响应一个事件。

三、表单事件

onsubmit事件应该绑在form表单里，而不是submit按钮上。

四：获得图层的横纵坐标利用的是 event

鼠标在图层中移动用的是 onmousemove 事件。

五、键盘事件

onkeydown 键盘按下的时候获得键盘按下的按键码

onkeyup 键盘的抬起例如统计输入的字符个数

    onkeypress

    event 对象包含了所有事件的状态。

2，文本域输入查过100字符后提示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta charset="utf-8">

</head>

<body>

<textarea id="c" cols="20" rows="5" onkeyup="up1()"></textarea><br/>
<span id="f"></span>

</body>
<script type="text/javascript">
   function up1(){
   var cont1=document.getElementById("c");
   var cont2=cont1.value;
   var len=cont2.length;
if(len >= 100)
{
alert("输入的字数不得超过100个字符");

}else{
document.getElementById("f").innerHTML = "输入的字符字数为："+len;

}}
</script>
</html>

事件笔记 案例 全

事件笔记案例全