首页 > 编程 > HTML > 正文

在html静态页面中给button加上提交链接的方法介绍

2020-03-24 16:49:26
字体:
来源:转载
供稿:网友
1、按钮做成链接(图片)的样子
提交按钮

 input type= submit html' target='_blank'>value= 提交 

提交链接

 a href= # quot;表单名字.submit() 提交 /a 

重置按钮

 input type= reset value= 重置 

重置链接

 a href= # quot;表单名字.reset() 重置 /a 

普通按钮

 input type= button value= 按钮 quot;函数() 

普通链接

 a href= # quot;函数() 链接 /a 

至于图片也一样把a标签换成img
2、链接做成按钮的样子

 a href= reg.asp 注册 /a = input type= button value= 注册 quot;location.href= reg.asp 

-----------------------------------
有的时候我们完全可以手工做一个get方式的表单,至于用按钮还是链接随心所欲。

 form action= xx.asp method= get name= form1  input name= aa type= text id= aa  input name= bb type= text id= bb  input type= submit name= Submit value= 提交  /form  input name= aa type= text id= aa  input name= bb type= text id= bb  input type= button value= 按钮 quot;location.href= xx.asp?aa= +document.all[ aa ].value+ bb= +document.all[ bb ].value 

-----------------------------------
进一步说我们还可以做一个按钮(链接)来同时传递js变量,表单input的值,asp变量,Recordset值

 script language= javascript var id1=1; /script id3=3rs.open exec,conn,1,1假设有rs( id4 )=4 input name= id2 type= text id= id2 value= 2  input type= button value= 按钮  quot;location.href= xx.asp?id1= +id1+ id2= +document.all[ id2 ].value+ id3= %=id3% id4= %=rs( id4 )% 

我们按下按钮会看到浏览器的url是xx.asp?id1=1 id2=2 id3=3 id4=4
在xx.asp中我们就可以用request.querystring来得到所有变量,这样是不是变相的客户端js和服务器段的变量传递?
------------------------------------------------------------------------------------------------------------------------------
如何给按钮加上链接功能

解决思路:
按钮属于控件级的对象,优先级比较高,所以不能象图片或文本一样直接加链接,只能通过按钮的单击事件调用脚本的方式来实现。
具体步骤:
1.在原窗口打开链接

 input type= button value= 闪吧 quot;location=’http://www.xxx.net’  button quot;location.href=’http://www.xxxx.net’ 闪吧 /button  form action= http://www.xxxx.net%22%3e%3cinput/ type= submit value= 打开链接 /form 

2.在新窗口中打开链接

 input type= button value= 闪吧 quot;window.open(’http://www.xxxx.net’)  button quot;window.open(’http://www.xxxx.net’) ggg /button  form action= http://www.xxxx.net/ target= _blank input type= submit value= 打开链接 /form 


注意:onClick调用的代码里的引号在只有一重时可以单双嵌套,超过两重就必须用 / 号转义且转义的引号必须跟里层的引号一致,如:

 button quot;this.innerHTML=’ font color=/’red/’ http://www.xxxx.net /font ’ 闪吧 /button 


 button this.innerHTML= font color=/ red/ http://www.xxxx.net /font ’ 闪吧 /button 

而下面都是错误的写法:

 button quot;this.innerHTML=’ font color=’red’ http://www.xxxx.net /font ’ 闪吧 /button  button quot;this.innerHTML=’ font color= red http://www.xxxx.net /font ’ 闪吧 /button  button quot;this.innerHTML=’ font color=/ red/ http://www.xxxx.net /font ’ 闪吧 /button 

提示:大部分属于window或document对象的方法和属性都可以省略前缀window或document,比如说本例中的location.href(location.href又可以简写为location,因为location的默认对象为href)就是window.location.href或document.location.href的省略式写法。

技巧:本例中还可以用下面的方法来代替location.href

location.replace(url)location.assign(url)navigate(url)

特别提示

第一步中的代码运行后,单击按钮将跳转到链接目标。而第二步的在单击按钮后将在新窗口中打开链接。

特别说明

本例主要是通过用onClick捕获用户在按钮上的单击事件,然后调用location对象的href方法或window对象的open方法来打开链接。另外一个技巧是通过提交表单来实现链接功能,按钮必须是type=submit类型的按钮,表单的action值就是链接目标,target值就是链接打开的目标方式。

以上就是在html静态页面中给button加上提交链接的方法介绍的详细内容,html教程

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表