问题描述:记得某天,发现一件让我非常气愤的事情,居然因为一个按钮导致页面跳转失败或者是根本跳转不了界面,哪怕404也不给我报。

问题回现步骤:
(1)正常输入url localhost:8080/test
可以看到一个登陆界面;

(2)正常录入表单信息点击提交,在输入正确的用户名和密码的前提下,居然最后出现这样的情况
地址由localhost:8080/test变为localhost:8080/test/?
多了一个问号,这让我觉得非常奇怪。

正常情况下,应该调用ajax中的方法 transit()方法,该方法体中只有一个window.location.href='index.html'
意思是只要异步验证通过,正确的用户名和密码的前提下,直接跳转到index.html界面。
然而并不是这样。

(3)我使用了window.location.replace()和window.open()方法测试,最后发现window.open()方法可以成功跳转到index.html,但是window.open()相当于新打开一个窗口,并不符合我的实际需要。

问题解决:

列出问题代码:
<button id="m_login_signin_submit" class="btn btn-focus m-btn m-btn--pill m-btn--custom m-btn--air m-login__btn m-login__btn--primary">
登录
</button>

改成这样就可以解决问题:
<input type="button" value="登录" id="m_login_signin_submit" class="btn btn-focus m-btn m-btn--pill m-btn--custom m-btn--air m-login__btn m-login__btn--primary"/>

在实际开发中,我们也遇到这样的问题,button不好使,点击不起作用,最后没办法只得换成input形式的button,结果这样往往就没有问题。

html或者css或者js不懂的,可以参考该网站:http://www.w3school.com.cn/

记一次js之button问题的更多相关文章

  1. Ext JS中Button的一般使用

    Ext JS中Button按钮的显示,以及按钮的部分事件 一.属性 renderTo:将当前对象所生成的HTML对象存放在指定的对象中 text:得到按钮名称 minWidth:按钮最小宽度 hidd ...

  2. js用button激活 Alert 元素关闭按钮的交互功能

    js用button激活 Alert 元素关闭按钮的交互功能 一.总结 1.点(.)对应class,井号(#)对应id  2.jquery:amaze里面用的jquery,jquery熟悉之后,这些东西 ...

  3. js 防止button频繁点击

    <input type="button" class="test" title="Select" value="Select ...

  4. 简单的JS控制button颜色随点击更改

    先上效果图: 默认“今日”是选中状态,是行内样式: <button type="button" id="today" class="btn-li ...

  5. js 倒计时 button不可用

    function showtime() { fun_timedown(5); } function fun_timedown(time) { $("#timedown").val( ...

  6. js验证 button 提交

    <form class="form-horizontal" role="form" action="member_add" metho ...

  7. JS 获取Button控件的提交类型

    <script type="text/javascript"> <!--获取button控件的类型---> function isAuditOrCancel ...

  8. 记一次js中和php中的字符串长度计算截取的终极问题和完美解决方案

    1.js是用unicode算长度的,比如单字节的算1,中文也算1,但是正常我们想让两个单字节算1,如何计算这个长度 第一种解决方案,用正则,如下 /[\u0x00-\u0xff]/,天真的想着,这样就 ...

  9. js复制button在ie下的解决方式

    源代码例如以下: <input class="width200" maxlength="32" type="text" id=&quo ...

随机推荐

  1. DICOM简介

    背景: DICOM分为两大类(这里只是从DICOM相关从业者日常工作角度出发来分类的):1)DICOM医学图像处理,即DCM文件中具体数据的处理,说图像可能有些狭隘,广义上还包括波形(心电).视频(超 ...

  2. Android 使用全局变量的问题

    现在每天都在忙,而且一忙起来,就把写笔记的事情放在了后面,最近在写程序的时候,突然要使用全局变量,就按照以前的方式,写了一个类,然后把变量都声明为静态变量,然后做为全局变量使用,但是在进行Activi ...

  3. [微信小程序]微信开发工具出现 1not found 编译 .wxss文件信息错误怎么办?

    错误代码: "1not found 编译 .wxss文件信息错误",如 下图 出现场景: 1.一般出现在安装新版本之后出现的状况,可能由于版本之间的兼容导致 解决办法: 1.重装整 ...

  4. WDCP上传SSL证书

    1.在线申请SSL证书 2.网站管理>SSL证书上传 3.将key文件直接上传,cert文件内容复制到crt文件中,再上传 4.开启https 注意:同一个域名下解析的若干域名,只能走主域名的证 ...

  5. JavaScript 常见面试题

    此文内容多为 JavaScript 对数组理解及运用. 1.如何消除一个数组里面重复的元素? var arr = [1, 2, 3, 3, 4, 4, 5, 5, 6, 1]; var newArr ...

  6. css3动画运用

    https://daneden.github.io/animate.css/ https://minimamente.com/example/magic_animations/    http://i ...

  7. CRM Online Outlook Client Configuration Wizard

    CRM Outlook客户端满足和便捷了用户对office outlook和CRM两个程序的使用需求.通过CRM outlook 客户端,用户可以像在浏览器中访问CRM一样,流畅的读写CRM数据.同时 ...

  8. Spring Boot—05页面跳转

    package com.smartmap.sample.ch1.controller.view; import org.springframework.stereotype.Controller; i ...

  9. Flutter隐藏控件方法

    new Offstage( offstage: true, //这里控制 child: Container(color: Colors.blue,height: 100.0,), ),

  10. 【转】Twitter Storm如何保证消息不丢失

    Twitter Storm如何保证消息不丢失 发表于 2011 年 09 月 30 日 由 xumingming 作者: xumingming | 可以转载, 但必须以超链接形式标明文章原始出处和作者 ...