2014年8月24日 星期日

[Web]JS網頁事件篇


  • 進入、離開網頁顯示訊息

<body onLoad="alert('歡贏')" onUnload="alert('謝謝')">

  • 單擊、雙擊滑鼠事件

<input type="button" onClick="alert('單擊')"><input type="button" onDbClick="alert('雙擊')">

  • 取得滑鼠的按鍵

function getButton(){    switch(event.button)    {        case 0 : alert("左鍵");break;        case 1 : alert("右鍵");break;        case 2 : alert("中鍵");break;    }}document.onmousedown  =  getButton;   //監聽器



  • 滑鼠按下事件

<body onmousedown="alert('點擊')">


  • 絕對禁止按滑鼠右鍵

<body onContextMenu="alert('NO') ;  return false" >


  •  滑鼠控制文字滾動

<marquee direction="up" onMouseOver="this.stop()"onMosueOut="this.start()">



  • 取得滑鼠座標

function getMouse(){    event.x;    event.y;}document.onmousemove = getMouse;



  • 交換式圖片按鈕

<img src="img1" onMouseOver = " this.src = ' img2 ' " onMouseOut = " this.src = ' img1 ' " >



  • 顯示或隱藏圖片

picID.style.visibility = 'visible'picID.style.visibility = 'hidden'



  • 取得按鍵ASCII編碼

function getkeyCode(){    asc = event.keyCode;    key = String.fromCharCode(asc);}document.onkeydown = getkeyCode;  // 可以取得所有按鍵,但無法分辨大小寫document.onkeypress = getkeyCode;  //可分辨大小寫



  • 前往某網頁

window.loaction.href =  "www.google.com";


  • 將按下的按鍵顯示在網頁上

asc = event.keyCode;key = String.fromCharCode(asc);str += key;txt.innerHTML = str;document.onkeypress = showkey;



  • 顯示不同滑鼠樣式

<div onMouseOver = "this.style.cursor='hand'">手形指標</div>




  • 使用外部滑鼠樣式

靜態指標:this.style.cursor='url(img.cur)'動態指標:this.style.cursor='url(img.ani)'

  • 登入密碼驗證
看網頁原始碼就破解
var password = prompt("請輸入密碼","");


  • 取得頁面所有超連結地址

陣列 = document.all.tags("A");























沒有留言:

張貼留言