精华内容
下载资源
问答
  • 关于HTML按钮跳转方法(及其相关)

    千次阅读 2021-02-03 09:27:04
    html 跳转问题(及其相关) 方法一 <a href="javascript:" onclick="history.go(-2); ">返回前两页</a> 方法二 <a href="javascript:" onclick="self.location=document.referrer;">返回上一页并...

    html 跳转问题(及其相关)
    方法一
    <a href="javascript:" onclick="history.go(-2); ">返回前两页</a> 
    方法二
    <a href="javascript:" onclick="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 οnlοad="abc()">
                            </body>

    4. asp跳转

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

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

    5. 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。


    比如:1,οnclick="form1.action='a.jsp';form1.submit();" 这样就实现了submit的功能了。
    2. <form name="form1" method="post" action="http://www.meijus.com">
    <input type="button" name="Button" value="Button" onClick="submit()"> </form>
    3. <input type="button" name="Button" value="Button" onClick="javascript:windows.location.href="你的url"">

     

    6. 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)">

     

     
    展开全文
  • input type=button value=按钮 onclick=javascrtpt:[removed].href='http://www.baidu.com/' />  或者直接使用button标签 <button onclick=[removed].href = 'https://www.baidu.com/'>百度</button&...
  • 最佳答案方案一,用里直接写刷新语句:html网页自动跳转代码--西农大网站测试:html网页自动跳转代码你可以在这里写下你想的一切东西!如:西北农林科技大学是一所985、211院校。方案二,用java script脚本来跳转...

    最佳答案

    方案一,用里直接写刷新语句:

    html网页自动跳转代码--西农大网站

    测试:html网页自动跳转代码

    你可以在这里写下你想的一切东西!

    如:西北农林科技大学是一所985、211院校。

    方案二,用java script脚本来跳转

    正在进入西农大网站 

    正在进入,请稍等...       

    测试:html网页自动跳转代码

    你可以在这里写下你想的一切东西!

    如:西北农林科技大学是一所985、211院校。

    如果您的浏览器不支持跳转,请点这里.

    最佳答案由网友  Eisuny  提供

    展开全文
  • HTML点击按钮button跳转页面的几种实现方法

    万次阅读 多人点赞 2019-11-20 16:30:09
    button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button> 方法一:在button标签中加上onclick属性,赋值为Javascript <input type="button" name=...

    其实我比较喜欢第一种方法

    <button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button>
    

    正文

    方法一:在button标签中加上onclick属性,赋值为Javascript

    <input type="button" onclick='location.href=("index.aspx")' />//在本页面打开
    <input type="button" onclick='window.open("bedzhao.aspx")' />//打开新页面
    
    <button onclick="window.location.href='../routeEdit/index.html'" type="button" id="add">新增</button>
    

    方法二:触发一个函数跳转

    <script>
        function jump(){
            window.location.href="http://blog.sina.com.cn/mleavs";
        }
    </script>
    <input type="button" value="我是一个按钮" οnclick=javascript:jump()>
    

    方法三:a标签的超链接可以直接嵌套一个button

    <a href="https://www.baidu.com/">
        <button>点我跳转到度娘!</button>
    </a>
    

    方法四:表单的action定向提交跳转

    <from action="xx.html" method="post">
        <input type="bottom" value="按钮">
    </from>
    

    还有其他方法,有些方法一些浏览器可能会不支持。

    结尾

    我是圆圆,如果我的文章对你的学习成长有所帮助,欢迎 点 赞 👍 支持,您的 点 赞 👍 支持是我进行创作和分享的动力!

    如果有问题可以留言评论或者私信我,我都会一一解答~笔芯🤞

    参考

    • https://blog.csdn.net/tjh625/article/details/81235827
    • https://blog.csdn.net/weixin_44025103/article/details/90017593
    展开全文
  • 微信小程序中,按钮也是<button></button>标签,它通过bindtap属性绑定点击事件: 然后在js里面注册这个回调函数: 回调函数里面通过 wx.navigateTo({ url: '/pages/index/talkPage', }) 跳转到talk...
  • 效果图目录结构:在我们做一个页面之前,要先想好他的一个整体布局,也就是我们这里面的login.html主页面,大致结构如下:接下来,我们先上代码,看一下具体实现方法:login.html<!DOCTYPE html> <html ...

    86567dc4561b1a16ea2bd8116026300a.png
    效果图

    目录结构:

    88ce10ff784243677b9bc9d95d64b1a3.png

    在我们做一个页面之前,要先想好他的一个整体布局,也就是我们这里面的login.html主页面,大致结构如下:

    2de6dc9932678b6899e21965ad9b9276.png

    接下来,我们先上代码,看一下具体实现方法:

    login.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>登录页面</title>
     
        <link rel="stylesheet" type="text/css" href="login.css"/>
        <script type="text/javascript" src="login.js"></script>
    </head>
     
    <body>
    <div id="login_frame">
     
        <p id="image_logo"><img src="images/login/fly.png"></p>
     
        <form method="post" action="login.js">
     
            <p><label class="label_input">用户名</label><input type="text" id="username" class="text_field"/></p>
            <p><label class="label_input">密码</label><input type="text" id="password" class="text_field"/></p>
     
            <div id="login_control">
                <input type="button" id="btn_login" value="登录" οnclick="login();"/>
                <a id="forget_pwd" href="forget_pwd.html">忘记密码?</a>
            </div>
        </form>
    </div>
     
    </body>
    </html>
    说明:
    在这个html里面,我们主要对登录界面进行了整体布局规划,利用div将内部的窗口、图片、标签、输入框、按钮、链接进行分块,这样方便我们之后用css对其进行准确的调位置、调边距。同时也对重要的几个东西设置了id和class,这也是方便我们之后用css对其进行准确的调颜色、调字体。

    login.js

    /**
     * Created by Kay on 2016/3/8.
     */
    function login() {
     
        var username = document.getElementById("username");
        var pass = document.getElementById("password");
     
        if (username.value == "") {
     
            alert("请输入用户名");
     
        } else if (pass.value  == "") {
     
            alert("请输入密码");
     
        } else if(username.value == "admin" && pass.value == "123456"){
     
            window.location.href="welcome.html";
     
        } else {
     
            alert("请输入正确的用户名和密码!")
     
        }
    }
    说明:
    这个js是用来判断用户名和密码是否正确的,实现起来还算简单。
    可以记一下,界面跳转的语句:
    window.location.href="welcome.html";
    其次就是对输入框的返回值的获取,这里我们用到了document.getElementById的知识点,通过document的对象方法来获得指定ID值的对象。这里要注意是byId,所以前面的html里的username和password要设id值,而不是name值,不然获取不到的!
    关于document的介绍可以点击该链接:详解JavaScript Document对象

    login.css

    body {
        background-image: url("images/login/loginBac.jpg");;
        background-size: 100%;
        background-repeat: no-repeat;
    }
     
    #login_frame {
        width: 400px;
        height: 260px;
        padding: 13px;
     
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -200px;
        margin-top: -200px;
     
        background-color: rgba(240, 255, 255, 0.5);
     
        border-radius: 10px;
        text-align: center;
    }
     
    form p > * {
        display: inline-block;
        vertical-align: middle;
    }
     
    #image_logo {
        margin-top: 22px;
    }
     
    .label_input {
        font-size: 14px;
        font-family: 宋体;
     
        width: 65px;
        height: 28px;
        line-height: 28px;
        text-align: center;
     
        color: white;
        background-color: #3CD8FF;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }
     
    .text_field {
        width: 278px;
        height: 28px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        border: 0;
    }
     
    #btn_login {
        font-size: 14px;
        font-family: 宋体;
     
        width: 120px;
        height: 28px;
        line-height: 28px;
        text-align: center;
     
        color: white;
        background-color: #3BD9FF;
        border-radius: 6px;
        border: 0;
     
        float: left;
    }
     
    #forget_pwd {
        font-size: 12px;
        color: white;
        text-decoration: none;
        position: relative;
        float: right;
        top: 5px;
     
    }
     
    #forget_pwd:hover {
        color: blue;
        text-decoration: underline;
    }
     
    #login_control {
        padding: 0 28px;
    }
    说明:
    这个css就是最难部分了,界面之所以能达到如此美观的效果,比如登录的窗口要在屏幕居中显示、背景透明、框的四个角要有一点弧度、登录按钮与输入框上下对齐等等。

    摘要:

    ①让背景图片拉伸且占据整个屏幕:

    background-size: 100%;
    background-repeat: no-repeat;

    ②让一个div块在整个屏幕居中:

    width: 400px;
    height: 260px;
    padding: 13px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -200px;
    margin-top: -200px
    (其中的margin-left:和margin-top最好是设为width和height的一半值,那样是完全居中的效果,当然记得前面要加个负号!)

    ③设置圆角:

    text-align: center;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;

    ④设置背景颜色且加透明效果:

    background-color: rgba(240, 255, 255, 0.5);

    ⑤让输入框和label对齐居中:

    form p > * {
        display: inline-block;
        vertical-align: middle;
    }

    ⑥去除链接的下划线:

    text-decoration: underline;

    7、给一个label或者button里面的文字设置居中:

       width: 120px;
       height: 28px;
       line-height: 28px;
       text-align: center;

    (需要设置line-height 其值等于 height 也就是字的行高等于它所在的label、button的高!)

    8、给“登录”和“忘记密码”的中间设置间距:

    先在html里给他们绑定一块div:

    <div id="login_control">
          <input type="button" id="btn_login" value="登录" οnclick="login();"/>
          <a id="forget_pwd" href="forget_pwd.html">忘记密码?</a>
     </div>

    然后在css里设置一下padding:

    #login_control {
        padding: 0 28px;
    }

    原文链接:网页制作:一个简易美观的登录界面_javascript_Kuroko's Development Notes-CSDN博客
    展开全文
  • HTML5之button跳转

    千次阅读 2020-03-25 18:02:17
    1.点击一个按钮跳转到另一个...直接加代码 if(confirm('确定跳转?')) 获取现在的位置 <input type=“button” value=“go” οnclick="if(confirm(‘确定跳转?’)){location.href=’ http://www.aseoe.com’}"...
  • type=button 就单纯是按钮功能 type=submit 是发送表单 但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性: 使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit...
  • ASP中按钮的点击触发网页跳转asp中要实现点击一个按钮转到另一个网页有几种方法就是按下一个BUTTON,转到另一个网页,一共有哪些方式实现? 我只知道ona标签,背景图按钮,直接点击跳转链接href="xxx.asp"asp 中怎么...
  • https://blog.csdn.net/mp624183768/article/details/85574563 转载于:https://www.cnblogs.com/zaks/p/11381993.html
  • js实现网页跳转脚本

    2021-06-09 00:58:03
    为什么要写这个脚本生活中很多时候会经常登录一个论坛或者网页但是每次打开浏览器都要输一遍网址,或者点开收藏的书签这样远远不如在桌面上打开文件点两下快,还能装X,多好前提条件需要会一些基础的html,...
  • HTML-跳转按钮(点击一个按钮跳转到新的页面)

    万次阅读 多人点赞 2018-01-26 14:52:49
    <button onclick="tz()">跳转</button> <script> function tz(){ window.location.href='目标网址'; } </script>
  • 点击按钮跳转到php网页

    千次阅读 2017-08-14 22:37:00
    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>login</title> <script> function login(){ window.location=...
  • MongoDB 任意代码执行漏洞(CVE-2013-4142) 漏洞版本: MongoDB 2.4.0-2.4.4 漏洞描述: CVE ID:CVE-2013-4142 MongoDB是一个高性能,开源,无模式的文档型数据库,是当前NoSql数据库中比较热门的一种 ... sql server ...
  • 相关问题这个是电信运营商在遇到域名解析不正确(网址还没有被注册,网站关闭、域名未解析)时自动跳转的(当然是广告啦),无法修复。这个是电信运营商在遇到域名解析不正确(网址还没有被注册,网站关闭、域名未解析)时...
  • html代码如何实现两个页面代码,点 击一个页面能跳转到另一个页面
  • html网页中 点击按钮页面跳转

    千次阅读 2015-10-27 16:30:00
    html页面中 实现点击按钮页面跳转。语句如下: &lt;input type="button" value="跳转" onClick="window.location.reload('学生报名注册.htm');"&gt; 点击“跳转按钮...
  • 编写一个html文件的网页代码,页面包含一个下拉列表框、一个文本框和一个按钮,下拉列表框选择要去的网站,当选择完毕后文本框中出现对应的网址。点击确认跳转按钮后访问文本框中出现的网址。 实现效果: 实现代码...
  • HTML 创建按钮实现跳转链接

    万次阅读 多人点赞 2017-07-01 20:13:57
    How to create an HTML button that acts like a link?
  • 网页设计如何从一个页面跳转到另一个页面”window.location.href = 'page2.html';html网页登录界面跳转设计在网页制作中如何实现不同页面之间的跳转在页面的开始位置加入一个书签,选择“插入”菜单下的“书签”...
  • 一个简单的实例,实现html上加按钮来打开其他的网页,用于其他程序的整合。
  • 对于大多数的编程老手来说,这些都不是什么难事,但对于一些新手或者没有深入学习编程开发的人来说,可能不知道如何去实现,在这里就和大家分享一下html js点击按钮滚动跳转定位到页面指定位置(DIV)的方法代码。...
  • 设置好微信公众号自定义菜单中,某一个菜单点击动作为发送消息后,想将这个点击动作换成跳转网页,在原来的基础上修改,是不成功的。以下是小编为您带来的关于微信公众号自定义菜单将点击动作换成跳转网页,...
  • 前言:我使用vue编写的h5公众号,实现点击小... 跳转小程序主要的标签是 wx-open-launch-weapp 第一步在vue项目下public文件夹下的index.html页面,引入微信配置文件,我直接在body标签引入 <body> <strong>
  • 本次解决的内容如标题:html5之间跳转页面传数据以及跳转后就执行页面的js代码 举个我的栗子:就是点击视频图片描述后,跳转到播放该视频的h5,因为跳转后视频播放页面video标签需要播放地址,一个视频的话可以写死...
  • 假设是需要在A页面上的一个按钮,点击后跳转到B页面,传一些参数后且并B页面的某个js函数可以执行~~关键在于如何跳转到目标页面之后并「接着」执行「目标页面的js函数」。原因是目标页面的某个js函数原来是需要点击...
  • HTML+JS实现页面跳转

    千次阅读 多人点赞 2020-02-16 19:04:15
    HTML+JS实现页面跳转代码关键代码解释结果展示 代码 话不多说,先上代码,该代码极其简单,可在我的GitHub中下载,链接在此 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"&...
  • 有两种方式: 1、在样式中直接添加 &lt;!DOCTYPE html&gt; &lt;html &gt; &lt;head&gt; &...button" value="缺失数据入口" onclick="location='
  • html点击链接打开app并跳转至指定的界面;...如果未登录,则先保存要跳转的界面数据然后到登录界面登录成功回来会自动跳转到需要跳转的界面;这里MainActivity的启动模式为singleTask,需要注意onNewIntent方法

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 114,124
精华内容 45,649
关键字:

html按钮跳转网页代码