当前位置: 首页 > news >正文

html5 web 按钮跳转方法(及其相关)

html5 web 按钮跳转方法(及其相关)

方法一
<a href="javascript:" οnclick="history.go(-2); ">返回前两页</a>
方法二
<a href="javascript:" οnclick="self.location=document.referrer;">返回上一页并刷新</a>
方法三
$(".btn").click(function(){
window.history.back();
});
//或者直接a标签添加
<a class="" href="javascript:history.go(-1)">返回</a>



1.点击一个按钮跳转到另一个页面 (网址) 两种写法:

<button οnclick="{location.href='location.html'}">获取现在的位置</button>

<input type="button" value="go" οnclick="location.href='http://www.aseoe.com'">
2.如果想弹出一个确认框之后再跳转

直接加代码 if(confirm('确定跳转?'))

<button οnclick="{ if(confirm('确定跳转?'))location.href='body/location.html'}">位置</button>

<input type="button" value="go" οnclick="if(confirm('确定跳转?')){location.href='

http://www.aseoe.com'}">



3.打开网页时自动触发按钮的单击事件

// 在<body>里加一个οnlοad="abc()"的属性就行了

                <head><script type="text/javascript">function abc(){alert("onload");}</script></head><body onload="abc()"></body>


  1. asp跳转

    如果是在ASP.net中,双击按钮,就可以进入后台页面,然在在后台页面写跳转代码 Response.Redirect("你想要跳转的网页");
    如果在html中,可以写一个form,指定你要跳转到的页面,当然这个按钮要这个form里面

例如:<form action="你要跳到的地址" method="post" > </form>



  1. button 与 submit 的不同

    type=button 就单纯是按钮功能
    type=submit 是发送表单
    但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性:
    使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一.

用button后往往页面不支持enter键了。所以需要支持enter键,必须要设置个submit,默认enter键对页面第一个submit进行操作。


<input type="submit" name="b1" value="提交" onClick="bt_submit_onclick()">
// 执行完onClick,转到action。可以自动提交不需要onClick。onclick这里可以不要。

<input type="button" name="b1" value="提交" onClick="bt_submit_onclick()">
// 执行完onClick,跳转文件在 js文件里控制。提交需要onClick。

//比如:

οnclick="form1.action='a.jsp';form1.submit();" //这样就实现了submit的功能了。

<form name="form1" method="post" action="http://www.meijus.com">
<input type="button" name="Button" value="Button" onClick="submit()"> </form>

<input type="button" name="Button" value="Button" onClick="javascript:windows.location.href="你的url"">



  1. js实现页面跳转的几种方式:

第一种:
<script language="javascript" type="text/javascript">
window.location.href="login.jsp?backurl="+window.location.href;
</script>

第二种:
<script language="javascript">
alert("返回");
window.history.back(-1);
</script>

第三种:
<script language="javascript">
window.navigate("top.jsp");
</script>

第四种:
<script language="JavaScript">
self.location='top.htm';
</script>

第五种:
<script language="javascript">
alert("非法访问!");
top.location='xx.jsp';
</script>

<input type="button" name="btn" value="跳转" οnclick="javascript:location.href='index.php'">
<input type="button" name="btn" value="返回" οnclick="javascript:history.back(-1)">

http://www.lryc.cn/news/199293.html

相关文章:

  • ES6 Generator 函数
  • 从零开始探索C语言(十二)----预处理器、输入输出及文件读写
  • 跨境电商:产业带的深度赋能
  • 09-Vue基础之实现注册页面
  • vue 树状结构数据渲染 (java 处理 list ->树状)
  • 惊艳!这些独特的搜索引擎你都知道吗?
  • 解除OU屏蔽(EBS检查无法直接查询解决)
  • 10月8日 Jdbc(1)
  • SAP 第三方销售/单独采购
  • yxy销售网站后台管理系统
  • 【vSphere 8 自签名证书】企业 CA 签名证书替换 vSphere Machine SSL 证书Ⅲ—— 颁发自签名证书
  • Hadoop3教程(十九):MapReduce之ETL清洗案例
  • 数据库设计阶段-架构真题(五十七)
  • python控制Windows桌面程序自动化模块uiautomation
  • Serializable 和Parcelable的区别
  • dubbogo-02 将服务注册到nacos
  • postgresql 配置文件 与 修改配置如何启用
  • 物联网专业前景怎么样?
  • JVM垃圾回收算法介绍
  • 紫光同创FPGA实现HSSTLP高速接口通信,8b/10b编解码数据回环,提供PDS工程源码和技术支持
  • Web前端—盒子模型:选择器、PxCook、盒子模型、正则表达式、综合案例(产品卡片与新闻列表)
  • C++ vector类模拟实现
  • FastAPI+Pydantic使用自定义参数校验+自定义异常+全局异常捕获
  • Python综合练习题
  • SpringCloud+Nacos集成Seata-1.7.0分布式事务
  • 任务调度框架-如何实现定时任务+RabbitMQ事务+手动ACK
  • 修炼k8s+flink+hdfs+dlink(六:学习k8s)
  • 红队专题-从零开始VC++C/S远程控制软件RAT-MFC-[4]客户端与服务端连接
  • Qt Designer生成ui文件,如何转py文件,如何运行
  • Python数据挖掘:自动售货机销售数据分析与应用