js点击button按钮跳转到另一个新页面

投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论

点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么做到呢?可以使用onclick=window.location=新页面来实现

点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢?

这样的效果可以:onclick="window.location='新页面'" 来实现。

1.在原来的窗体中直接跳转用

代码如下

window.location.href="你所要跳转的页面";

2、在新窗体中打开页面用:

代码如下

window.open('你所要跳转的页面');

window.history.back(-1);返回上一页

代码如下

<input type="submit" name="Submit" value="同意" onclick=window.open(http://www.jb51.net/)>

如果要在点击按钮提交时验证输入款是否填入了内容,要怎么做呢?当用户名输入或者其它的为空的时候,点击按钮不提交,可以按下列的方法做。

代码如下

<input type="submit" name="submit" onclick="open()">
<script language=javascript> fuction open(){
if(!document.form_name.username.value) {
alert("请输入用户名!"); document.form_name.username.focus(); return false;
}else document.form_name.action="aaa.htm";
} </script>

这样的话,当空值时,点击按钮还是不会跳转到另外的页面呢?这样就达到了效果了。

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>

=====javascript中弹出选择框跳转到其他页面=====

<script language="javascript">

<!--

function logout()...{

if (confirm("你确定要注销身份吗?是-选择确定,否-选择取消"))...{

window.location.href="logout.asp?act=logout"

}

}

-->

</script>

=====javascript中弹出提示框跳转到其他页面=====

<script language="javascript">

<!--

function logout()...{

alert("你确定要注销身份吗?");

window.location.href="logout.asp?act=logout"

}

-->

</script>

PHP——0128练习相关2——js点击button按钮跳转到另一个新页面的更多相关文章

  1. js点击button按钮跳转到另一个新页面

    点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...

  2. js点击button按钮跳转到页面代码

    点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...

  3. 如何获取ul 中li选中的值点击button按钮跳转链接

    <ul id="parent"> <li></li> <li></li> <li></li> & ...

  4. 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  5. RFS_点击button按钮之后,RFS出现卡死的问题

    [html代码] <html> <head> <title> 主窗口 </title> </head> <body> <d ...

  6. 《笔记篇》非JS方法跳转到一个新页面,主要防止客户端禁止浏览器JS以后的跳转异常

    用非JS方法打开一个新页面,主要防止客户端禁止浏览器JS以后的跳转失效 <meta http-equiv="refresh" content="0; url=htt ...

  7. JS解析Json 数据并跳转到一个新页面,取消A 标签跳转

    JS解析Json 数据并跳转到一个新页面,代码如下 $.getJSON("http://api.cn.abb.com/common/api/staff/employee/" + o ...

  8. JS 点击复制按钮 将文字复制到手机剪贴板

    我们在制作移动端网页的时候,经常会遇到这样一个问题,如何点击一个"复制"按钮,把一串文字复制到手机剪贴板,如上图所示. 看了网上的一些方法后,感觉那些方法都太复杂,有点要用插件,有 ...

  9. 项目遇到的小问题(关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答)

     第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...

随机推荐

  1. MapReduce开发技巧

    数据类型的选择 自定义数据类型 参考:Hadoop提交作业自定义排序和分组 MapWritable/SortedMapWritable Hadoop中可传输的Map集合,和Java中的Map用法差不多 ...

  2. 【干货合集】Docker快速入门与进阶

    收录待用,修改转载已取得腾讯云授权 Docker 在众多技术中,绝对是当红炸子鸡.这年头,如果你不懂一点容器,不学一些Docker,还怎么出去跟人炫耀技术? Docker 也是云计算技术中较为热门的一 ...

  3. Cognos如何开启CJAP认证程序日志

    步骤: 1:修改ipfaaaclientconfig.xml.sample为ipfclientconfig.xml,修改<param name="File" value=&q ...

  4. CLS(公共语言规范)的CLSCompliant(跨语言调用)

    .net的一个很重要的特性就是跨语言的编程,用C#写的dll可以在VB.net里调用,例如:用C#写的一个类,编译到dll中,然后在VB.net中调用: using System;namespace  ...

  5. TCP/IP具体解释学习笔记——地址解析协议ARP

    一 概述 我们知道,IP协议是用来在不同的物理网络之间数据传输的.要在不同的网络之间数据传输,至少须要将IP协议所用的地址转换成特定网络所使用的物理地址. 一般来说.就是将IPv4地址转换为mac地址 ...

  6. 理解 select poll epoll

    举例说明:老师收学生作业,相当于应用层调用I/O操作. 1.老师逐个收学生作业,学生没有做完,只能阻塞等待,收了之后,再去收下一个学生的作业.这显然存在性能问题. 2.怎么解决上面的问题? 老师找个班 ...

  7. MongoDB 在 Mac OSX 平台安装

    1.检查电脑是否安装 Homebrew(brew) 工具.如果没有安装,在终端执行下面命令. ruby -e "$(curl -fsSL https://raw.githubusercont ...

  8. Python 面向对象编程基础

    Python 面向对象编程基础 虽然Pthon是解释性语言,但是Pthon可以进行面向对象开发,小到 脚本程序,大到3D游戏,Python都可以做到. 一类: 语法: class 类名: 类属性,方法 ...

  9. PotPlayer 如何设置多屏幕全屏播放

      如何在播放器中,设置扩展播放模式? 全屏设置/主全屏显示设备:Display2   如何使视频播放时,没有黑边并且全屏充满? 高宽比/处理方式:保持全屏宽高比   如果取消掉视频上方的文字提示信息 ...

  10. 每日算法之二十三:Reverse Nodes in k-Group

    Given a linked list, reverse the nodes of a linked list k at a time and return its modified list. If ...