>[success] # 注意点 >[danger] ##### 验证码的刷新 ~~~ <img src="/checkcode.html/" id="code" onclick="chagecode(this)"> // 验证码 function chagecode(ths) { ths.src = ths.src + "?"; }; ~~~ >[danger] ##### ajax 判断失败刷新验证码 ~~~ var img = $('#code')[0]; img.src = img.src+"?"; ~~~ >[success] # 代码 ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <link href="/static/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet"></link> <style> div.register{ height: 500px; width: 500px; border: 1px solid; } .register h1{ text-align: center; } .title{ font: 700 16px/40px 微软雅黑 ; color: black; } .username,.nickname,.email,.password,.confirm_password{ width: 250px; } </style> <body> <div class="container register"> <form id="registerfrom"> {% csrf_token %} <h1>用户注册</h1> <div class="row"> <div class="col-lg-3 title">用户名</div> <div class="col-lg-9"> {{ rgisterfrom.username }} <span id="form-user-error" class="erro" ></span> </div> </div> <div class="row"> <div class="col-lg-3 title">昵&nbsp称</div> <div class="col-lg-9"> {{ rgisterfrom.nickname }} <span id="form-nick-error" class="erro" ></span> </div> </div> <div class="row"> <div class="col-lg-3 title">密&nbsp码</div> <div class="col-lg-9"> {{ rgisterfrom.password }} <span id="form-pwd-error" class="erro" ></span> </div> </div> <div class="row"> <div class="col-lg-3 title">确认密码</div> <div class="col-lg-9"> {{ rgisterfrom.confirm_password }} <span id="form-cpwd-error" class="erro" ></span> </div> </div> <div class="row"> <div class="col-lg-3 title">邮&nbsp箱</div> <div class="col-lg-9"> {{ rgisterfrom.email }} <span id="form-email-error" class="erro" ></span> </div> </div> <div class="row"> <div class="col-lg-2 title">验证码</div> <div class="col-lg-5">{{ rgisterfrom.check_code }}</div> <div class="col-lg-5"><img src="/checkcode.html/" id="code" onclick="chagecode(this)"></div> <span id="form-code-error" class="erro" ></span> </div> <div> <a id="submit" class="btn btn-info" style="float: right;margin:15px 15px "> 注册</a> </div> </form> </div> <script src="/static/js/jquery-1.12.4.js"></script> <script src="/static/plugins/bootstrap/js/bootstrap.min.js"></script> <script> $(function () { SubmitBind(); }); // 验证码 function chagecode(ths) { ths.src = ths.src + "?"; }; function SubmitBind() { $("#submit").click( function () { $.ajax({ url:"/register.html/", method:"POST", data:$('#registerfrom').serialize(), dataType:"JSON", success:function (arg) { if(arg.status){ location.href="/login.html" }else{ // 验证码 var img = $('#code')[0]; img.src = img.src+"?"; console.log(arg.message) var erro_msg = arg.message if (erro_msg['check_code']){ $('#form-code-error').text(erro_msg['check_code']) }else{ $('#form-code-error').text("") }; if (erro_msg['email']){ $('#form-email-error').text(erro_msg['email']) }else{ $('#form-email-error').text("") } } } }) } ) } </script> </body> </html> ~~~