984
JavaScript按鈕類的簡單操作
按鈕類： 1.頁麵刷新： function renovates() { document.location.reload(); } 2.動態為按鈕添加事件： function addClick(obj) { obj.onclick=function() //綁定按鈕的單擊事件 { alert('動態添加事件成功 '); //單擊事件完成的功能－輸出提示 } } <input type="button" value=" 測試" /><input type="button" value="為上麵的按鈕添加事件" /> 3. 選擇不同的列表項就顯示不同的按鈕 function butSelect() { var selVal = document.getElementById("sel").value; if(selVal == "1") { document.getElementById("td").innerHTML = '<input type="button" value="按鈕1" >'; } else if(selVal == "2") { document.getElementById("td").innerHTML = '<input type="button" value="按鈕2" >'; } else { document.getElementById("td").innerHTML = ''; } } function btnc1() { alert("單擊了按鈕1"); } function btnc2(){ alert("單擊了按鈕2"); } <td> <select onChange="butSelect();" > <option value="" > <option value="1">but1 <option value="2">but2 </select> </td> <td ></td> 4.圖片式按鈕； function goTo() { var myindex=document.myform.mailBox.selectedIndex //獲取下拉框中的選擇索引 location=document.myform.mailBox.options[myindex].value;//獲取下拉框的選擇值 } <select name="mailBox" size=1> <option selected>選項</option> <option value="https://www.163.net">163電子郵局</option> <option value="https://www.263.net">263電子郵局</option> </select><br /> <a href="javascript: goTo()" mce_href="javascript: goTo()" onMouseOver="self.status='';return true" onMouseOut="self.status='';return true"> <img src="按鈕1.gif" mce_src="按鈕1.gif" border=0 align="middle" /></a> 5.刪除時的確認提示； <script language="javascript"> function del() { if(confirm("確實要刪除嗎?")) alert("已經刪除！"); else alert("已經取消了刪除操作"); } <script> <input type="button" value="刪除" /> 6.獲取控件的絕對位置 function getAddress(e) { var t=e.offsetTop; var l=e.offsetLeft; while(e=e.offsetParent) { t+=e.offsetTop; //獲取X坐標 l+=e.offsetLeft; //獲取Y坐標 } alert("x坐標="+t+" y坐標為="+l); } <input type="button" value="坐標" /> 7.定義熱鍵； <form action="https://www.google.com" method="get" name="form1"> <input type="submit" accessKey="S" value="提交(Alt+s)"> 8.更改狀態欄信息； <input type="button" value="修改狀態欄" onClick="self.status='歡迎光臨我們的工作室!';" name="button"> 9.動態添加按鈕； function addInput() { var o = document.createElement("input"); //使用DOM的創建元素方法 o.type = "button" ; //設置元素的類型 o.value = "按鈕" + i++ ; //設置元素的值 o.attachEvent("onclick",addInput); //為控件添加事件 document.body.appendChild(o); //添加控件到窗體中 o = null; //釋放對象 } <body > 10.按鈕回車鍵=點擊登錄按鈕； <script language="JavaScript"> function keyLogin() { if (event.keyCode==13) //回車鍵的鍵值為13 document.getElementById("input1").click(); //調用登錄按鈕的登錄事件 } </script> <body onkeydown="keyLogin();"> <input value="登錄" type="button" >
最後更新：2017-04-02 03:42:39