| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>客户认证</title>
- <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
- </head>
- <body>
- <div class="body">
- <h2 style="margin-bottom:50px;">客户手机号认证</h2>
- <div style="margin-bottom: 20px;">
- <input id="test" name="test" type="text" placeholder="输入验证码" />
- </div>
- <div>
- <button id="code" style="background-color:#ffa133;">获取验证码</button>
- <button id="tijiao" style="background-color:#95bbff;">提交</button>
- </div>
- </div>
- </body>
- <script>
- //获取url中的参数
- function getQueryString(name) {
- var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
- var r = window.location.search.substr(1).match(reg);
- if (r != null) return unescape(r[2]); return null;
- }
- var baseurl = getQueryString("baseurl");
- var orderno = getQueryString("orderno");
- $("#code").click(function () {
- $.ajax({
- contentType: "application/json",
- type: "post", // 请求方式
- data: JSON.stringify({
- orderno: orderno,
- }),
- url: baseurl + "/order/yongAn/getMessage", // 请求路径
- dataType: "json", // 预期返回一个 json 类型数据
- success: function (data) { // data是形参名,代表返回的数据
- console.log(data)
- }
- });
- });
- $("#tijiao").click(function () {
- var code = $("input").val();
- $.ajax({
- contentType: "application/json",
- type: "post", // 请求方式
- data: JSON.stringify({
- orderno: orderno,
- verificationCode: code,
- }),
- url: baseurl + "/api/yongan/getPayUrl", // 请求路径
- dataType: "json", // 预期返回一个 json 类型数据
- success: function (data) { // data是形参名,代表返回的数据
- console.log(data)
- if (data.code == '200') {
- window.location.href = data.msg;
- }
- }
- });
- });
- </script>
- </html>
- <style>
- .body {
- padding: 30px;
- width: 100%;
- height: auto;
- box-sizing: border-box;
- display: flex;
- flex-direction: column;
- align-items: center;
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- margin: auto;
- }
- input {
- outline-style: none;
- border: 1px solid #ccc;
- border-radius: 3px;
- padding: 13px 14px;
- width: 250px;
- font-size: 14px;
- font-weight: 700;
- font-family: "Microsoft soft";
- }
- input:focus {
- border-color: #66afe9;
- outline: 0;
- -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)
- }
- button {
- border: none;
- width: 130px;
- height: 40px;
- border-radius: 10px;
- color: #fff;
- }
- </style>
|