web页面调用qq

最新推荐文章于 2020-12-07 19:15:11 发布

原创最新推荐文章于 2020-12-07 19:15:11 发布 · 5.1k 阅读

1 ·

CC 4.0 BY-SA版权

前端demo 专栏收录该内容

1 篇文章

订阅专栏

遇到一个需求，需要再web页面调用qq（点击按钮打开qq）。
从网上查了一下，发现给到的方案在移动端和pc端有点区别，所以改进了一下发到这里。

话不多说，直接上代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="author" content="cmge_zhiming"/>
    <!--2020-03-10 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no, email=no">
    <meta name="description" content="">
    <title></title>
    <script src="js/size.js"></script>
    <style>
        .btn {
            border: 1px solid black;
            border-radius: 10px;
            padding: 5px;
        }
    </style>
</head>

<body>
<div class="main">
    <div class="btn">
        click me
    </div>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script>
        $('.btn').on('click', function () {
            (function (w, reg) {
                if (reg.test(navigator.userAgent)) {
                    window.open("mqqwpa://im/chat?chat_type=wpa&uin=1172969610&version=1&src_type=web&web_src=oicqzone.com");
                } else {
                    window.open("http://wpa.qq.com/msgrd?v=3&uin=1172969610&site=qq&menu=yes")
                }
            })(window, /Mobile|Windows Phone|Android|iPhone|iPod|BlackBerry|SymbianOS|webOS/i);
        })
    </script>
</div>
</body>

</html>

核心代码是这块：

    (function (w, reg) {
                if (reg.test(navigator.userAgent)) { //判断是否为手机端
                    window.open("mqqwpa://im/chat?chat_type=wpa&uin=1172969610&version=1&src_type=web&web_src=oicqzone.com");
                } else {  //不是手机端的话，打开这个链接，
                    window.open("http://wpa.qq.com/msgrd?v=3&uin=1172969610&site=qq&menu=yes")
                }
            })(window, /Mobile|Windows Phone|Android|iPhone|iPod|BlackBerry|SymbianOS|webOS/i);
        })
        //这里的uin=1172969610，1172969610为qq号，可根据自己的需求进行更改。