# Html代码: 注意里面表单属性。name名字有需要自己修改就可以,表单布局用的bootstrap布局 ~~~ <form method="post" id="register" class="form-horizontal" style="padding-bottom: 50px"> <div class="card" style="padding-bottom: 20px"> <div class="card-header"> 账号注册 </div> <div class="card-block"> <div class="form-group mt-4 "> <label class="col-sm-3 control-label">账号</label> <div class="col-sm-7"> <input type="text" name="usename" class="form-control"> </div> </div> <div class="card-block"> <div class="form-group mt-4 "> <label class="col-sm-3 control-label">密码</label> <div class="col-sm-7"> <input type="text" name="password" class="form-control"> </div> </div> <div class="card-block"> <div class="form-group mt-4 "> <label class="col-sm-3 control-label">确认密码</label> <div class="col-sm-7"> <input type="text" name="password_confirm" class="form-control"> </div> </div> </div> <div class="card-block"> <div class="form-group mt-4 "> <label class="col-sm-3 control-label">验证码</label> <div class="col-sm-7"> <div class="input-group mb-3"> <input type="text" class="form-control" name="code" placeholder="请输入验证码" aria-label="Recipient's username" aria-describedby="basic-addon2"> <div class="input-group-append"> <span class="input-group-text" id="basic-addon2"> <img onclick="this.src='index/user/code?'+Math.random()" alt="点击更换" title="点击更换" src="index/user/code" /> </span> </div> </div> </div> </div> </div> </div> </form> <div class="text-center "> <button type="button" class="btn btn-success" id="reg">注册账号</button> <button type="button" class="btn btn-danger " id="ret">重新输入</button> </div> ~~~ # js 代码 ~~~ <script> //表单清空 $('#ret').click(function () { $('#register')[0].reset(); }) </script> ~~~