• 日期: 2028-02-03
  • 标签: 常规
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <title>在线视频解析 - 超级播放器</title>
    <style type="text/css">
        body,html,#WANG {
            background-color: #000;
            padding: 0;
            margin: 0;
            color: transparent;
            height: 100%;
            width: 100%;
        }
        body,html {
            background-color: #000;
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
            color: transparent;
        }
        body {
            position: relative;
            display: flex;
            flex-direction: column;
            height: 100vh;
            /* 设置容器高度为视窗高度 */
        }
        .panel {
            background: #000000;
            background-size: 90% 90%;
            padding-top: 10px;
            color: #ffffff;
            display: none;
            flex-wrap: wrap;
        }
        .panel a:link,.panel a:visited,.panel a:hover,.panel a:active {
            text-decoration: none;
            color: #ffffff;
            font-weight: bold;
        }
        .slide {
            margin: 0;
            padding: 0;
            border-top: solid 0px #000000;
        }
        .jiexi {
            display: block;
            position: relative;
            right: 0px;
            width: 90px;
            height: 26px;
            padding-top: 5px;
            font-family: 宋体;
            font-family: arial, sans-serif;
            font-size: 14px;
            color: #ffffff;
            background: #2C2C2C;
            text-decoration: none;
            text-align: center;
            -moz-border-top-left-radius: 5px;
            -moz-border-top-right-radius: 5px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            -moz-border-bottom-left-radius: 5px;
            -moz-border-bottom-right-radius: 5px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }
        .panel a.selected {
            color: #ff5f00;
        }
        /* 添加半透明弹窗样式 */
        .modal {
            display: none;
            position: fixed;
            z-index: 1;
            padding-top: 100px;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgba(0,0,0,0.8);
        }
        .modal-content {
            background-color: #fefefe;
            margin: auto;
            padding: 20px;
            border: 1px solid #888;
            width: 80%;
        }
        .close {
            color: #aaa;
            float: right;
            font-size: 28px;
            font-weight: bold;
        }
        .close:hover,.close:focus {
            color: black;
            text-decoration: none;
            cursor: pointer;
        }
        /* 输入框样式 */
        .input-container {
            margin-bottom: 20px;
        }
        .input-container input {
            width: 100%;
            padding: 12px 20px;
            margin: 8px 0;
            display: inline-block;
            border: 1px solid #ccc;
            box-sizing: border-box;
        }
        .input-container button {
            background-color: #4CAF50;
            color: white;
            padding: 14px 20px;
            margin: 8px 0;
            border: none;
            cursor: pointer;
            width: 100%;
        }
        .input-container button:hover {
            opacity: 0.8;
        }
    </style>
    <script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script>
</head>
<body style="overflow-y:hidden;" id="body">
    <div class="panel" id='panel1'>
        播放器：
        <a href="javascript:void(0)" data-player="qw" class="selected">【Artplayer】</a>
        <a href="javascript:void(0)" data-player="dp">【Dplayer】</a>
        <a href="javascript:void(0)" data-player="ck">【Ckplayer】</a>
        <a href="javascript:void(0)" data-player="xg">【XiGua精简版】</a>
        <a href="javascript:void(0)" data-player="mui">【MuiPlayer】</a>
        <a href="javascript:void(0)" data-player="plyr">【Plyr】</a>
    </div>
    <div class="panel" id='panel2'>
        解析线路：
        <a href="javascript:void(0)" data-jiexi="0" class="selected">【1线】</a>
        <a href="javascript:void(0)" data-jiexi="1">【2线】</a>
        <a href="javascript:void(0)" data-jiexi="2">【3线】</a>
        <a href="javascript:void(0)" data-jiexi="3">【4线】</a>
        <a href="javascript:void(0)" data-jiexi="4">【5线】</a>
        <a href="javascript:void(0)" data-jiexi="5">【6线】</a>
        <a href="javascript:void(0)" data-jiexi="6">【7线】</a>
        <div class="input-container">
            <input type="text" id="dmId" placeholder="填充弹幕" />
            <button id="fillDanmu">确认</button>
        </div>
    </div>
    <p class="slide">
        <a class="jiexi">播放设置</a>
    </p>
    <div style="margin:auto;width:100%;height:100%;">
        <iframe  id="WANG" border="0" src="./loading.svg" width="100%" height="100%" allowfullscreen marginWidth="0" frameSpacing="0" marginHeight="0" frameBorder="0" scrolling="no" vspale="0" noResize></iframe>
    </div>
    <!-- 添加半透明弹窗 -->
    <div id="myModal" class="modal">
        <div class="modal-content">
            <span class="close">&times;</span>
            <div class="panel" id='panel1'>
                播放器：
                <a href="javascript:void(0)" data-player="qw" class="selected">【Artplayer】</a>
                <a href="javascript:void(0)" data-player="dp">【Dplayer】</a>
                <a href="javascript:void(0)" data-player="ck">【Ckplayer】</a>
                <a href="javascript:void(0)" data-player="xg">【XiGua精简版】</a>
                <a href="javascript:void(0)" data-player="mui">【MuiPlayer】</a>
                <a href="javascript:void(0)" data-player="plyr">【Plyr】</a>
            </div>
            <div class="panel" id='panel2'>
                解析线路：
                <a href="javascript:void(0)" data-jiexi="0" class="selected">【1线】</a>
                <a href="javascript:void(0)" data-jiexi="1">【2线】</a>
                <a href="javascript:void(0)" data-jiexi="2">【3线】</a>
                <a href="javascript:void(0)" data-jiexi="3">【4线】</a>
                <a href="javascript:void(0)" data-jiexi="4">【5线】</a>
                <a href="javascript:void(0)" data-jiexi="5">【6线】</a>
                <a href="javascript:void(0)" data-jiexi="6">【7线】</a>
            </div>
        </div>
    </div>
</body>
<script>
    window.addEventListener('message', function (event) {
        var eventData = event.data;
        var from = eventData.from;
        var id = eventData.id;
        var name = eventData.name;
        var group = eventData.group;
        var next = eventData.next;
        var sid = eventData.sid;
        var nid = eventData.nid;
        var api = eventData.api;
        var dmId = eventData.dmId;
        var url = "<?php echo $url; ?>";
        // 获取用户的选择
        var playerChoice = localStorage.getItem("playerChoice");
        var jiexiChoice = localStorage.getItem("jiexiChoice");
        // 根据用户的选择设置默认播放器和线路
        const code = playerChoice ? playerChoice : 'qw';
        const platforms = ["youku", "qq", "qiyi", "mgtv", "pptv", "letv", "sohu", "wasu", "m1905", "funshion", "migu", "bilibili", "xigua"];
        if (platforms.includes(from) && jiexiChoice !== null) {
            var key = jiexiChoice;
        } else {
            var key = '0';
        }
        // 拼接播放器地址
        var playerUrl = "https://www.superplayer.top/player/ec.php?code=" + code + "&if=1&from=" + from + "&id=" + id +
            "&name=" + name + "&group=" + group + "&next=" + next + "&sid=" + sid + "&nid=" + nid + "&api=" + api +
            "&dmId=" + dmId + "&key=" + key + "&url=" + url;
        // 设置播放器地址
        var iframeObj = document.getElementById("WANG");
        iframeObj.src = playerUrl;
        //选中的a标签变色
        $('.panel#panel1 a').removeClass('selected');
        $('.panel#panel1 a[data-player="' + code + '"]').addClass('selected');
        $('.panel#panel2 a').removeClass('selected');
        $('.panel#panel2 a[data-jiexi="' + key + '"]').addClass('selected');
    });
</script>
<script type="text/javascript">
    function player(newValue) {
        var iframe = document.getElementById("WANG");
        var src = iframe.src;
        var newSrc = src.replace(/code=[^&]*/, "code=" + newValue);
        iframe.src = newSrc;
        $('.panel#panel1 a').removeClass('selected');
        $('.panel#panel1 a[data-player="' + newValue + '"]').addClass('selected');
    }
    function jiexi(newValue) {
        var iframe = document.getElementById("WANG");
        var src = iframe.src;
        var newSrc = src.replace(/key=[^&]*/, "key=" + newValue);
        iframe.src = newSrc;
        $('.panel#panel2 a').removeClass('selected');
        $('.panel#panel2 a[data-jiexi="' + newValue + '"]').addClass('selected');
    }
</script>
<script>
    // 获取模态框元素
    var modal = document.getElementById("myModal");
    // 获取关闭按钮元素
    var span = document.getElementsByClassName("close")[0];
    // 获取播放设置按钮元素
    var jiexiButton = document.querySelector(".jiexi");
    // 获取填充弹幕按钮
    var fillDanmuButton = document.getElementById("fillDanmu");
    // 打开模态框
    jiexiButton.addEventListener('click', function() {
        modal.style.display = "block";
    });
    // 关闭模态框
    span.onclick = function() {
        modal.style.display = "none";
    };
    // 当用户点击模态框以外的区域时关闭模态框
    window.onclick = function(event) {
        if (event.target == modal) {
            modal.style.display = "none";
        }
    };
    // 填充弹幕按钮点击事件
    fillDanmuButton.addEventListener('click', function() {
        var dmIdInput = document.getElementById("dmId");
        var dmIdValue = dmIdInput.value;
        // 获取iframe对象
        var iframe = document.getElementById("WANG");
        // 获取iframe的src属性
        var src = iframe.src;
        // 替换&dmId=后面的参数
        var newSrc = src.replace(/&dmId=[^&]*/, "&dmId=" + dmIdValue);
        // 设置新的src属性
        iframe.src = newSrc;
        // 关闭模态框
        modal.style.display = "none";
    });
    $('#panel1 a').click(function () {
        var playerChoice = $(this).attr("data-player");
        // 保存用户的选择
        localStorage.setItem("playerChoice", playerChoice);
        // 切换播放器和线路
        player(playerChoice);
        // 隐藏.panel
        $('.panel').slideToggle('slow');
    });
    $('#panel2 a').click(function () {
        var jiexiChoice = $(this).attr("data-jiexi");
        // 保存用户的选择
        localStorage.setItem("jiexiChoice", jiexiChoice);
        // 切换播放器和线路
        jiexi(jiexiChoice);
        console.log(jiexiChoice);
        // 隐藏.panel
        $('.panel').slideToggle('slow');
    });
</script>
</html>
在线视频解析 - 超级播放器

原文地址: https://www.cveoy.top/t/topic/p16d 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录