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. Opencv 完美配置攻略 2014 (Win8.1 + Opencv 2.4.8 + VS 2013)

    http://my.phirobot.com/blog/2014-02-opencv_configuration_in_vs.html 2012年4月给同学写了篇傻瓜式的 VS2010+Opencv- ...

  2. jQuery框架开发一个最简单的幻灯效果

    在线演示 在这个课程中,我们将介绍如何使用jQuery来开发一个最简单的图片幻灯效果. 立刻观看互动课程:jQuery框架开发一个最简单的幻灯效果 阅读原文:jQuery框架开发一个最简单的幻灯效果

  3. CPU五级流水线project(带Hazard)

    project简单介绍: 计算机组成原理课程Project--五级流水线hazard处理 思路说明: CPU架构图: CPU指令集: 代码在这里:cpu_hazard

  4. bash中的命令基本操作

    1.命令行编辑功能 命令行编辑功能是指用户可以使用方向键前后移动光标,并编辑已经输入的命令,这个命令非常实用.方便. 提示:可能大多数读者都没有使用过不带命令行编辑功能的shell,有兴趣的读者可以使 ...

  5. Unity3D随意截图并保存

    http://blog.csdn.net/awnuxcvbn/article/details/9199245 效果 代码 <pre name="code" class=&qu ...

  6. 算法笔记_040:二进制幂(Java)

    目录 1 问题描述 2 解决方案 2.1 从左至右二进制幂 2.2 从右至左二进制幂   1 问题描述 使用n的二进制表示,计算a的n次方. 2 解决方案 2.1 从左至右二进制幂 此方法计算a的n次 ...

  7. android 实现摇一摇功能

    实现“摇一摇”功能,其实很简单,就是检测手机的重力感应,具体实现代码如下: 一.在 AndroidManifest.xml 中添加操作权限 二.实现代码 package com.xs.test; im ...

  8. No implementation found for long com.baidu.platform.comjni.map.commonmemcache.JNICommonMemCache.Create()

    3-21 10:14:20.833 2892-2892/? E/art: No implementation found for long com.baidu.platform.comjni.map. ...

  9. PLSQL Split分割字符串

    系统自带的split,使用起来方便,但是如果字符串太长,可能会出现异常,这里,我自己写了一个也是该名字,放在自己的包中,引用的时候带包名就好了. --系统自带的函数 /*CURSOR cur_temp ...

  10. appframework学习--nav的使用说明

    app-framework学习--nav的使用说明: 语法: <nav id="mynav" style="background-image:url(../imag ...