javascript經(jīng)典案例(編輯修改稿)
2025-07-10 07:10 本頁面
【文章內(nèi)容簡介】 heck() amp。amp。 passCheck()amp。amp。bdaycheck()) return true。 else return false。 …… } /SCRIPT …… input type=button name=Button value= 登 錄 onsubmit=return validateform( ) …… onsubmit不是登錄按鈕的事件 常見的事件 事件 動作 事件 動作 Abort 中止正在加載的對象 Unload 關(guān)閉當(dāng)前網(wǎng)頁 Blur 失去焦點 MouseDown 按下鼠標(biāo)左鍵 Focus 獲取焦點 MouseMove 移動鼠標(biāo)指針 Change 改變對象的值 MouseOut 鼠標(biāo)指針離開某對象 Click 在對象上單擊鼠標(biāo) MouseOver 鼠標(biāo)指針懸停于某對象之上 DblClick 在對象上雙擊鼠標(biāo) MouseUp 放開鼠標(biāo)左鍵 DrogDrop 拖拽對象 Move 窗口被移動時 Error 加載文件或圖形時發(fā)生錯誤 Resize 窗口大小被改變 KeyDown 按下鍵盤上的任意鍵的瞬間 Select 選擇某對象 KeyPress 按下鍵盤上的任意鍵時 Submit 單擊表單上的 Submit按鈕 KeyUp 某鍵被按下后彈起來的瞬間 Reset 單擊表單上的 Reset按鈕 Load 瀏覽器讀入文件時 如何使用圖片代替提交按鈕 為了美觀，現(xiàn)把提交按鈕變成圖片，但仍然保持 表單的驗證功能？如何實現(xiàn)？ 使用圖片的單擊事件。 onClick=checkForm( ) 如何使用圖片代替提交按鈕 根據(jù)上述分析和提供的素材頁面來實現(xiàn)表單驗證。 素材頁面 …… SCRIPT language=JavaScript function checkForm( ) { if ( ==0) { alert(用戶名不能為空！ )。 ( )。 } } /SCRIPT …… IMG src=images/ onClick=checkForm( ) 檢驗是否為空 單擊事件，調(diào)用表單驗證函數(shù) 如何使用圖片代替提交按鈕 能進(jìn)行表單驗證，但即使是正確填寫了表單，也 不能提交頁面（點擊“注冊”沒反映）。 如何使用圖片代替提交按鈕 因為圖片不具備“提交”按鈕的提交功能，所以需 要人工調(diào)用提交方法－ submit( ) 。 SCRIPT language=JavaScript function checkForm( ){ if ( ==0) { alert(用戶名不能為空！ )。 ( )。 } else{ ( )。 } } /SCRIPT 查看源代碼 如果表單輸入合法，則提交表單 制作回車切換輸入的效果 輸入完畢后回車，默認(rèn)會提交表單。 頁面效果 如何制作回車 Tab切換效果？ 頁面效果 keyCode代碼 代碼 說明 代碼 說明 8 BackSpace 34 Next 9 Tab 35 End 12 Clear 36 Home 13 Enter 37 Left 16 Shift_L 38 Up 17 Control_L 39 Right 18 Alt_L 40 Down 20 Caps_Lock 46 Delete 33 Prior 65 a A 48 0 90 z Z 制作回車切換輸入的效果 使用鍵盤輸入事件 onKeyDown事件 檢查輸入是否是回車鍵－ ASCII碼 13，若是則將 輸入改為 Tab鍵－ ASCII碼 9 script language=javascript type=text/javascript function changeFocus( ){ if (==13) =9。 } /script …… INPUT name=sname type=text class=borderBox onKeyDown=changeFocus( ) …… 鍵盤按下，調(diào)用實 現(xiàn) Tab效果的函數(shù) 修改回車鍵為 Tab鍵 Event事件對象包含輸入鍵信息 制作回車切換輸入的效果 上述注冊頁面中，需要給每個文本框添加鍵盤按 下事件，有沒有更簡單的辦法？ …… INPUT name=sname type=text class=borderBox onKeyDown=changeFocus( ) …… INPUT name=pass type=password class=borderBox id=pass size=25 onKeyDown=changeFocus( ) INPUT name= type=text class=borderBox …… id= size=24 onKeyDown=changeFocus( ) ? keyCode：得到在鍵盤上按下的鍵 ? srcElement： .type 得到標(biāo)簽類型 .tagname 得到標(biāo)簽名稱 event對象 制作回車切換輸入的效果 通過給 document對象添加鍵盤事件。 script language=javascript function changeFocus( ){ if (==13 amp。amp。 !=39。button39。 amp。amp。 !=39。submit39。 …) =9。 } //調(diào)用表單的 onKeyDown事件 /script 如果按鍵是回車鍵，并且控件類型不是提交、重置按鈕等按鈕，則變?yōu)?Tab切換 document對象的onKeyDown事件 ，它將接收頁面中所有的鍵盤事件 數(shù)組與級聯(lián)列表框 預(yù)習(xí)檢查 ?什么是省市級聯(lián)特效？ ?在 JavaScript中，如何定義一維數(shù)組 Array？ ?在 JavaScript中，是否支持二維數(shù)組？ 本章任務(wù) 演示示例 1： 頁面效果 演示示例 2： 頁面效果 制作通用的省市級聯(lián)效果 制作學(xué)期、課程級聯(lián)效果 ?會使用下拉列表框控件實現(xiàn)省市級聯(lián)功能 ?會使用數(shù)組優(yōu)化省市級聯(lián)功能 本章目標(biāo) 下拉列表框 ?得到選擇項的索引（從 0開始） 表單名 .列表名 .selectedIndex。 ?清空列表項 表單名 .列表名 .=0。 ?創(chuàng)建選項 Option1= new Option(選項名 ,選項值 )。 ?增加選項 表單名 .列表名 .(Option1)。 實現(xiàn)簡單
教學(xué)教案相關(guān)推薦
鄂ICP備17016276號-1