js-sdk-module
/
index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>js-sdk测试页面</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <meta content="width=device-width,initial-scale=0.85,maximum-scale=1.0,user-scalable=no" name="viewport">
        <meta content="yes" name="apple-mobile-web-app-capable">
        <meta content="black" name="apple-mobile-web-app-status-bar-style">
        <meta content="telephone=no" name="format-detection">
        <meta content="email=no" name="format-detection">
        <meta content="always" name="referrer">
        <script type="text/javascript" src="/static/js/jquery-3.6.0.min.js"></script>
        <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
        <link rel="stylesheet" href="/static/bootstrap3.4.1/css/bootstrap.min.css"
              integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu"
              crossorigin="anonymous">
        <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
        <link rel="stylesheet" href="/static/bootstrap3.4.1/css/bootstrap-theme.min.css"
              integrity="sha384-6pzBo3FDv/PJ8r2KRkGHifhEocL+1X2rVCTTkUfGk7/0pbek5mMa1upzvWbrUbOZ"
              crossorigin="anonymous">
        <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
        <script src="/static/bootstrap3.4.1/js/bootstrap.min.js"
                integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
                crossorigin="anonymous"></script>
    </head>
    <body>
        <div class="container-fluid">
            <div class="jumbotron">
                <h3>欢迎使用js-sdk-module测试工具！</h3>
            </div>
            <!-- 针对超小屏幕和中等屏幕设备，即 .col-xs-* 和 .col-md-*-->
            <!-- 针对平板设备的 .col-sm-* 类-->
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <ul class="list-group">
                        <li class="list-group-item"><span class="badge progress-bar-danger">新</span>
                            测试工具1
                            <input type="text" class="form-control" id="mobile" placeholder="请输入手机号">
                            <button type="button" class="btn btn-primary" onclick="getMobileAttr()">获取归属地</button>
                            <div class="panel panel-default">
                                <div class="panel-body" id="result-panel">

                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <script>
            function getMobileAttr() {
                const mobile = $('#mobile').val();
                console.log(mobile);
                new JSSDK({
                    mobile: mobile,
                    success: function (success) {
                        $('#result-panel').val(success)
                    },
                    failure: function (err) {
                        $('#result-panel').val(err)
                    }
                }).getMobileAddress();
            }
        </script>
    </body>
</html>