QQ号码价值评估系统html代码-丢塔网

由于前面刷视频经常刷到有人直播QQ号码价值评估，想着也搞一个玩玩，找了一圈接口好像很多都用不来，下面提供一个自己随便搞得页面，有兴趣的大佬可以完善下

`

QQ号码价值评估系统-在线工具-丢塔网（www.diuta.com）
body { font-family: "Microsoft YaHei", sans-serif; background: linear-gradient(135deg, rgba(245, 247, 250, 1) 0, rgba(195, 207, 226, 1) 100%); min-height: 100vh; margin: 0; padding: 20px }
.container { max-width: 800px; margin: 0 auto; background: rgba(255, 255, 255, 1); border-radius: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); padding: 30px; position: relative; overflow: hidden }
h1 { color: rgba(18, 183, 245, 1); text-align: center; margin-bottom: 30px; position: relative }
h1:after { content: ""; display: block; width: 100px; height: 3px; background: rgba(18, 183, 245, 1); margin: 10px auto }
.search-box { display: flex; margin-bottom: 30px }
#qq-input { flex: 1; padding: 12px 15px; border: 2px solid rgba(224, 224, 224, 1); border-radius: 8px 0 0 8px; font-size: 16px; outline: none; transition: border 0.3s }
#qq-input:focus { border-color: rgba(18, 183, 245, 1) }
#search-btn { padding: 0 25px; background: linear-gradient(45deg, rgba(18, 183, 245, 1), rgba(14, 159, 216, 1)); color: rgba(255, 255, 255, 1); border: none; border-radius: 0 8px 8px 0; cursor: pointer; font-size: 16px; font-weight: bold; transition: all 0.3s }
#search-btn:hover { background: linear-gradient(45deg, rgba(14, 159, 216, 1), rgba(11, 143, 199, 1)); transform: translateY(-2px) }
.result-container { display: none; animation: 0.5s fadein }
@keyframes fadeIn { 0% { opacity: 0; transform: translateY(20px) } 100% { opacity: 1; transform: translateY(0) } }
.basic-info { display: flex; align-items: center; margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px dashed rgba(224, 224, 224, 1) }
.avatar { width: 100px; height: 100px; border-radius: 50%; margin-right: 25px; border: 3px solid rgba(18, 183, 245, 1); box-shadow: 0 5px 15px rgba(18, 183, 245, 0.3) }
.value-container { background: linear-gradient(135deg, rgba(248, 249, 250, 1) 0, rgba(233, 236, 239, 1) 100%); border-radius: 10px; padding: 20px; margin: 20px 0; box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.05) }
.value-text { text-align: center; font-size: 28px; font-weight: bold; margin-bottom: 15px; color: rgba(51, 51, 51, 1) }
.value-amount { font-size: 36px; color: rgba(255, 87, 34, 1); text-shadow: 0 2px 5px rgba(255, 87, 34, 0.2) }
.value-indicator { height: 20px; background: rgba(224, 224, 224, 1); border-radius: 10px; margin: 15px 0; overflow: hidden; position: relative }
.value-bar { height: 100%; background: linear-gradient(90deg, rgba(255, 149, 0, 1), rgba(255, 45, 85, 1)); width: 0; transition: width 1s cubic-bezier(0.68, -0.55, 0.27, 1.55); position: relative }
.value-bar:after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 10px; background: rgba(255, 255, 255, 0.5); transform: skewX(-15deg) }
.detail-container { margin-top: 30px }
.detail-title { font-size: 18px; color: rgba(18, 183, 245, 1); margin-bottom: 15px; padding-bottom: 5px; border-bottom: 1px solid rgba(224, 224, 224, 1) }
.detail-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; margin-bottom: 10px; background: rgba(248, 249, 250, 1); border-radius: 8px; transition: all 0.3s }
.detail-item:hover { background: rgba(233, 236, 239, 1); transform: translateX(5px) }
.detail-label { font-weight: bold; color: rgba(85, 85, 85, 1) }
.detail-score { font-weight: bold; color: rgba(255, 87, 34, 1) }
.loading { text-align: center; display: none; margin: 20px 0 }
.loading-spinner { display: inline-block; width: 40px; height: 40px; border-top: 4px solid rgba(18, 183, 245, 1); border-right: 4px solid rgba(18, 183, 245, 0.2); border-bottom: 4px solid rgba(18, 183, 245, 0.2); border-left: 4px solid rgba(18, 183, 245, 0.2); border-radius: 50%; animation: 1s linear infinite spin }
@keyframes spin { 100% { transform: rotate(360deg) } }
.error { color: rgba(255, 87, 34, 1); text-align: center; padding: 15px; background: rgba(255, 243, 243, 1); border-radius: 8px; margin: 20px 0; display: none }
.special-tag { display: inline-block; padding: 3px 8px; background: rgba(255, 87, 34, 1); color: rgba(255, 255, 255, 1); border-radius: 4px; font-size: 12px; margin-left: 10px; vertical-align: middle }

QQ号码价值评估系统

立即评估

正在评估中，请稍候...

QQ号码:

QQ邮箱:

评估价值: 0元

详细评估指标

号码长度
0分

重复数字
0分

豹子号加成
0分

顺子号加成
0分

特殊组合
0分

<script>
    document.getElementById('search-btn').addEventListener('click', function() {
        const qqNumber = document.getElementById('qq-input').value.trim();
        if (!qqNumber || !/^[1-9]\d{4,10}$/.test(qqNumber)) {
            showError('请输入5-11位的有效QQ号码');
            return;
        }

        document.getElementById('loading').style.display = 'block';
        document.getElementById('error').style.display = 'none';
        document.getElementById('result-container').style.display = 'none';

        // 模拟API请求延迟
        setTimeout(() => {
            try {
                const result = evaluateQQValue(qqNumber);
                displayResult(qqNumber, result);
            } catch (error) {
                showError('评估过程中出现错误');
            } finally {
                document.getElementById('loading').style.display = 'none';
            }
        }, 800);
    });

    function displayResult(qq, data) {
        document.getElementById('avatar').src = `https://q2.qlogo.cn/headimg_dl?dst_uin=${qq}&spec=640`;
        document.getElementById('qq-nickname').textContent = `QQ用户`;
        document.getElementById('qq-number').textContent = qq;
        document.getElementById('qq-email').textContent = `${qq}@qq.com`;

        // 更新评估分数
        document.getElementById('length-score').textContent = `${data.lengthScore}分`;
        document.getElementById('repeat-score').textContent = `${data.repeatScore}分`;
        document.getElementById('straight-score').textContent = `${data.straightScore}分`;
        document.getElementById('sequence-score').textContent = `${data.sequenceScore}分`;
        document.getElementById('special-score').textContent = `${data.specialScore}分`;
        document.getElementById('value-score').textContent = data.totalValue;

        // 动画效果
        setTimeout(() => {
            document.getElementById('value-bar').style.width = `${Math.min(100, data.totalValue / 50000 * 100)}%`;
        }, 100);

        document.getElementById('result-container').style.display = 'block';
    }

    function evaluateQQValue(qq) {
        const length = qq.length;

        // 1. 号码长度估值（5-11位）
        const lengthValue = (12 - length) * 5000;  // 越短价值越高
        const lengthScore = Math.round(lengthValue / 500);

        // 2. 重复数字估值
        let repeatValue = 0;
        const counts = {};
        qq.split('').forEach(num => {
            counts[num] = (counts[num] || 0) + 1;
        });

        Object.values(counts).forEach(cnt => {
            if(cnt >= 2) {
                repeatValue += Math.pow(10, cnt) * 100; // 重复次数越多价值越高
            }
        });
        const repeatScore = Math.round(repeatValue / 1000);

        // 3. 豹子号估值（3+连续相同数字）
        let straightValue = 0;
        const straightMatches = qq.match(/(\d)\1{2,}/g) || [];
        straightMatches.forEach(match => {
            straightValue += Math.pow(10, match.length) * 200;
        });
        const straightScore = Math.round(straightValue / 1000);

        // 4. 顺子号估值（连续递增/递减）
        let sequenceValue = 0;
        if(/(123|234|345|456|567|678|789|987|876|765|654|543|432|321)/.test(qq)) {
            sequenceValue = 5000;
        }
        const sequenceScore = Math.round(sequenceValue / 100);

        // 5. 特殊组合估值
        let specialValue = 0;
        if(/^[1-9]0+$/.test(qq)) { // 结尾多个0
            specialValue = 3000 * (qq.match(/0/g) || []).length;
        }
        const specialScore = Math.round(specialValue / 100);

        const totalValue = lengthValue + repeatValue + straightValue + sequenceValue + specialValue;

        return {
            lengthScore,
            repeatScore,
            straightScore,
            sequenceScore,
            specialScore,
            totalValue
        };
    }

    function showError(message) {
        const errorEl = document.getElementById('error');
        errorEl.textContent = message;
        errorEl.style.display = 'block';
    }
</script>

`提供一个演示地址：https://diuta.com/api/qq_value.html