界面层bug笔记

来源：互联网发布：什么是数据存储编辑：程序博客网时间：2024/06/09 14:47

一、window.history.go(-1);返回上一页跳转失败------button没有指定具体类型，缺省值为submit

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><!DOCTYPE html><html><head>   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">   <meta name="viewport" content="width=device-width, initial-scale=1.0">      <title>Delete</title>      <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">     <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>   <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>      <script type="text/javascript">     function GetQueryString(name)     {          var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");          var r = window.location.search.substr(1).match(reg);          if(r!=null)          return  unescape(r[2]);           return null;     }     $(document).ready(function(){    $("#id").val(GetQueryString("id"));     $("#username").val(GetQueryString("name"));      });          function returnLast(){     window.history.go(-1);     }   </script></head><body><nav class="navbar navbar-default" role="navigation"><div class="container-fluid">     <div class="navbar-header">        <a class="navbar-brand" href="#">测试</a>    </div>    <div>        <!--向右对齐-->        <ul class="nav navbar-nav navbar-right">            <li class="dropdown">                <a id="username" href="#" class="dropdown-toggle" data-toggle="dropdown">                    <b class="caret"></b>                </a>                <ul class="dropdown-menu">                    <li><a href="http://localhost:8080/Spring_Mybatis/toLogin">Sign out</a></li>                </ul>            </li>        </ul>    </div></div></nav><div class="container">    <div class="row">        <div class="col-md-8 col-md-offset-2">            <div class="panel panel-default">                <div class="panel-heading text-center">                    <h2>Delete Your Account</h2>                </div>                <div class="panel-body">                    <form class="form-horizontal" role="form" method="POST" action="delete">                        <input type="hidden" name="_token" value="QFe0UARw5ThQWOQTtEetutiShrDpBZbCQBd87ypf">                                               <div class="form-group">                            <label for="id" class="col-md-4 control-label">Id</label>                            <div class="col-md-6">                                <input id="id" type="text" class="form-control" name="id" readonly="true">                            </div>                        </div>                        <div class="form-group">                            <label for="name" class="col-md-4 control-label">Name</label>                            <div class="col-md-6">                                <input id="name" type="text" class="form-control" name="name" readonly="true">                            </div>                        </div>                        <div class="form-group">                            <div class="col-md-6 col-md-offset-4">                                <button  class="btn btn-primary" onclick="returnLast()">                                       Cancel                                     </button>                                                                  <button type="submit" class="btn btn-primary">                                        Confirm to delete the user?                                  </button>                            </div>                        </div>                    </form>                </div>            </div>        </div>    </div></div></body></html>

如上的代码中，cancel按钮在点击后调用了window.history.go(-1);目标是返回上一页，但是这里很奇怪地会调用表单提交功能，执行Delete action，多次尝试都失败了。

在网上找了会儿，发现一篇博客，http://blog.csdn.net/orichisonic/article/details/54096066

原来是我的cancel按钮没有指定类型，而默认的类型是submit，导致界面返回失败，并且还自动执行了Form的提交。

阅读全文

0 0