JavaScript按钮类的简单操作 按钮类： 1.页面刷新： function renovates() { document.location.reload(); } 2.动态为按钮添加事件： function addClick(obj) { obj.onclick=function() //绑定按钮的单击事件 { alert('动态添加事件成功 '); //单击事件完成的功能－输出提示 } } <input id="Button2" type="button" value=" 测试" /><input id="Button1" type="button" value="为上面的按钮添加事件" onclick="addClick(Button2)" /> 3. 选择不同的列表项就显示不同的按钮 function butSelect() { var selVal = document.getElementById("sel").value; if(selVal == "1") { document.getElementById("td").innerHTML = '<input type="button" value="按钮1" onclick="btnc1();">'; } else if(selVal == "2") { document.getElementById("td").innerHTML = '<input type="button" value="按钮2" onclick="btnc2();">'; } else { document.getElementById("td").innerHTML = ''; } } function btnc1() { alert("单击了按钮1"); } function btnc2(){ alert("单击了按钮2"); } <td> <select onChange="butSelect();" id="sel"> <option value="" > <option value="1">but1 <option value="2">but2 </select> </td> <td id="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="http://www.163.net">163电子邮局</option> <option value="http://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" style=" 73px; height: 40px" /></a> 5.删除时的确认提示； <script language="javascript"> function del() { if(confirm("确实要删除吗?")) alert("已经删除！"); else alert("已经取消了删除操作"); } <script> <input id="Button1" type="button" value="删除" onclick="del()" /> 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 id="Button1" type="button" value="坐标" onclick="getAddress(this)" /> 7.定义热键； <form action="http://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 onload="addInput();"> 10.按钮回车键=点击登录按钮； <script language="JavaScript"> function keyLogin() { if (event.keyCode==13) //回车键的键值为13 document.getElementById("input1").click(); //调用登录按钮的登录事件 } </script> <body onkeydown="keyLogin();"> <input id="input1" value="登录" type="button" onclick="alert('调用成功！')">