image.png

以下是一个简单的 HTML 页面示例,包含了一个国内常见的分享功能,使用了社交媒体分享按钮,例如微信、微博和 QQ 空间。

   <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <style>
        /* 分享按钮的样式 */
       .share-button {
            display: inline-block;
            padding: 10px 20px;
            margin: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
            background-color: #f0f0f0;
            cursor: pointer;
        }
    </style></head><body>
    <h1>欢迎来到分享页面</h1>
    <p>请点击下面的按钮将此页面分享到不同的社交媒体平台。</p>
    <!-- 微信分享按钮 -->
    <div class="share-button" id="wechat-share">微信分享</div>
    <!-- 微博分享按钮 -->
    <div class="share-button" id="weibo-share">微博分享</div>
    <!-- QQ 空间分享按钮 -->
    <div class="share-button" id="qqzone-share">QQ 空间分享</div>

    <script>
        $(document).ready(function() {
            // 微信分享按钮点击事件
            $("#wechat-share").click(function() {
                // 微信分享的 URL 接口,需要替换为实际的微信分享接口,这里只是示例
                var shareUrl = "https://api.weixin.qq.com/share?url=" + encodeURIComponent(window.location.href);
                // 模拟打开微信分享接口,实际情况可能需要与微信的 SDK 集成
                window.open(shareUrl, "_blank");
                alert("请在微信中打开分享页面,并进行操作。");
            });

            // 微博分享按钮点击事件
            $("#weibo-share").click(function() {
                // 微博分享的 URL 接口,使用微博的分享接口,这里将页面标题和 URL 作为参数传递
                var title = encodeURIComponent(document.title);
                var url = encodeURIComponent(window.location.href);
                var shareUrl = "https://service.weibo.com/share/share.php?url=" + url + "&title=" + title;
                // 打开微博分享页面
                window.open(shareUrl, "_blank");
            });

            // QQ 空间分享按钮点击事件
            $("#qqzone-share").click(function() {
                // QQ 空间分享的 URL 接口,将页面标题和 URL 作为参数传递
                var title = encodeURIComponent(document.title);
                var url = encodeURIComponent(window.location.href);
                var shareUrl = "https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=" + url + "&title=" + title;
                // 打开 QQ 空间分享页面
                window.open(shareUrl, "_blank");
            });
        });
    </script>