onChange事例:

<HTML><HEAD>
 <SCRIPT LANGUAGE="JavaScript">

     function checkNum(num) {
    
         if (num == "") {
             alert("请输入一个数字值");
             return false;
         }
  
  if (isNaN (num)){
   alert("请输入一个数字值");
   return false;
  }
  else alert("谢谢！");
  
  //onChange事件要把光标移到外面去(在文本框中)
   }
</SCRIPT>
</HEAD>

<BODY bgColor = white>
<FORM>
 请输入一个数字：
  <INPUT type ="text" name ="text1" onChange="checkNum(this.form.text1.value)"> 
</FORM>
</BODY></HTML>
 

 

单选按钮事件示例:

<HTML><HEAD><TITLE>选项按钮对象的事件</TITLE>
<SCRIPT LANGUAGE="JavaScript">
 function offButton(){
     var the_box = window.document.form_1.radio_1;
   if (the_box.checked == true){
       window.document.form_1.radio_2.checked = false;//关灯时要把开灯的单选按钮不选中
     document.bgColor='black';  alert("请把灯打开！"); }
 }
 function onButton()
 { var the_box = window.document.form_1.radio_2;
   if (the_box.checked == true)
     { window.document.form_1.radio_1.checked = false;
     document.bgColor='white';   alert("谢谢！"); }
 }
</SCRIPT>
</HEAD><BODY BGCOLOR="#FFFFFF" TEXT="red">
<form name="form_1">
   <input type="radio" name ="radio_1" onClick="offButton();">关灯
 <input type="radio" name ="radio_2" onClick="onButton();" checked>开灯
</form>
</BODY></HTML>
 

 

复选框事件示例:

<HTML><HEAD><TITLE>复选框对象的事件</TITLE>
<SCRIPT LANGUAGE="JavaScript">
 function switchLight()
 {
     var the_box = window.document.form_2.check_1;//从window到document到form一级一级来的
     var the_switch = "";
     if (the_box.checked == false)
          {        alert("请把灯打开！");       document.bgColor='black';   }
     else
          {    alert("谢谢！");  document.bgColor='white';   }
       }
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
 <form name="form_2">
  <input type="checkbox" name ="check_1" onClick="switchLight();">电灯开关
 </form>
</BODY>
</HTML>
 

 

命令按钮事件示例:

HTML>
<HEAD>
 <TITLE>按钮对象的事件</TITLE>图10.3a：示例3的输出结果
 <SCRIPT LANGUAGE="JavaScript">
  function writeIt(value)
  {
    myfm.second_text.value=value;
  }
 </SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
 <Form name="myfm"><input type="text" name="first_text">
  <INPUT TYPE="button" value="复制" onClick="writeIt(myfm.first_text.value);">
  <input type="text" name="second_text">
 </FORM>
</BODY>
</HTML>
 

组合框事件：

<HTML><HEAD><TITLE>组合框对象的事件</TITLE>
 <SCRIPT LANGUAGE="JavaScript">
 function show(txt)
 {
     alert("选中的是" + txt);

     //show(the_form.choose_category.options[selectedIndex].text
  
 }
 </SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="pink">
<form name="the_form">
 <select name="choose_category"   
 onChange="show(the_form.choose_category.options[selectedIndex].text);">
  <option selected>狗</option>
  <option>鱼</option>
  <option>鸟</option>
 </select>
</form>
</BODY>
</HTML>
 

 

onClick事件：

<HTML><HEAD>
<SCRIPT LANGUAGE="JavaScript">

    function compute(fm) {
        if (confirm("确定吗?")) {
            fm.result.value = (eval(fm.expr.value));//计算表达式的值，并将结果显示在另外一个文本框
    } else {
    aler("请重试");
        }
    }
</SCRIPT>
</HEAD>
<BODY>
<FORM>请输入表达式：
<input type="text" name="expr" /><br />

<input type="button" value="计算" οnclick="compute(this.form)"  /><br />
结果：
<input type="text" name="result" />


 
</FORM>
</BODY></HTML>
 

 

Onblur与Onfocus事件：

<HTML>
<BODY BGCOLOR="lavender">
 <FORM>
  <INPUT type = text name = text1
  οnblur="(document.bgColor='aqua')"
  οnfοcus="(document.bgColor='dimgray')">
 </FORM>
</BODY>
</HTML>
 

Onmousedown与Onmouseup事件：

<HTML>
<BODY BGCOLOR="lavender">
<FORM>
 <INPUT type = button name =text1 value="改变颜色"
 οnmοusedοwn="(document.bgColor='aqua')"
 οnmοuseup="(document.bgColor='limegreen')"
</FORM>
</BODY>
</HTML>
 

onLord事件：

<HTML>
  <HEAD>
   <TITLE>您好</TITLE>
    <SCRIPT LANGUAGE="JavaScript">
      function hello()
      {
        alert("您好");
     }
    </SCRIPT>
  </HEAD>
<BODY onLoad="hello()">
</BODY>
</HTML>
 

 

onMouseOver事件：

<html><head>
  <script language="javascript">
    var num =0;
    function showLink(num) {
        if (num == 1) {
        //document.forms[0].elements[0].value表示文档中第一个form表单的第一个input元素的value值 ,这就是典型的DOM操作
            document.forms[0].elements[0].value = '你选择了百度'
        } //
       
 
    if (num==2){
  document.forms[0].elements[0].value = "您选择了163";
    }
    if (num==3){
  document.forms[0].elements[0].value = "您选择了sina";
    }
  }
  </script>
</head>
<body>

<form>
<input type=text size=60>
</form>

<a href="#" onMouseOver="showLink(1)">baidu</a><br>
<a href="#" onMouseOver="showLink(2)">163</a><br>
<a href="#" onMouseOver="showLink(3)">sina</a><br>

</body>
</html>
 

 文本域事件：

<HTML>
<HEAD>
 <TITLE>文本域对象的事件</TITLE>
 <SCRIPT LANGUAGE="JavaScript">
     function writeIt(value) {
         alert(value);
     }
 </SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<Form name="myfm">
 <input type="text" name="first_text"
       onFocus="writeIt('焦点');"     onBlur="writeIt('模糊');"
     onChange="writeIt('修改');">
 <TEXTAREA NAME="txt_area " ROWS="10" COLS="10"></TEXTAREA>
</FORM>
</BODY>
</HTML>