2025-10-08 07:05:23
家里亲戚找我,说有台苹果手机的数据需要迁移到另外一台苹果手机上,问我知不知道弄,我说没操作过,可以试一试。然后简单了解了一下,这里进行记录,以备日后查阅。
目前主流的方式有四种:电脑备份还原、iCloud云备份还原、无线对传、有线对传。
电脑备份还原算是比较原始的方式,需要有一台电脑。
有线对传需要有一根可以连接两部手机的数据线。
这两种方法受限于设备,本文暂且不记录。
其实用苹果的大部分人都知道有这么个功能,但是受限于默认5GB的大小,所以压根没想到可以用来进行数据转移。
实际上苹果提供了一个免费临时空间,通过这个临时空间,可以备份整机的所有数据,而且大小没有限制,需要注意的是备份保存时间只有21天。
开启路径:设置-通用-传输或还原iPad(iOS15以上)
这个由于一直匹配不到旧设备,暂时未进行实践。
iPhone手机数据迁移最先出现在龙鲲博客。
2025-10-01 19:59:05
前两天肩膀不舒服,于是去医院检查了一下,医生说是由于脖子前倾压迫导致的,给我发了一些资料,要我没事的时候做一下,这里简单记录一下,以备日后查阅。
备份链接:https://www.yuque.com/bmlk/ygmdbg/cdl69fecdv20h5i3?view=doc_embed&title=0
备份链接:https://www.yuque.com/bmlk/ygmdbg/utk6d1tsuqipkqbm?view=doc_embed&title=0
备份链接:https://www.yuque.com/bmlk/ygmdbg/qy2ocesy165gno17?view=doc_embed&title=0
4、
5、
备份链接:https://www.yuque.com/bmlk/ygmdbg/mi2r82cx3ur7yn31?view=doc_embed&title=0
备份链接:https://www.yuque.com/bmlk/ygmdbg/meorff7m2coqv0cg?view=doc_embed&title=0
8、
9、避免久站久坐,少弯腰,腰不负重,睡卧硬板床,佩腰围带,多卧床休息。平常可做:双手托住腰部向前挺,散步时倒退走路,靠墙蹲厕所样轻松蹲1一2分钟,利用身体重力垂直往下拉脚离地面1cm的吊单杠即做人工样牵引。颈部避免久低头多仰望,少玩手机,枕头高度不超过本人肩膀厚度,热天电风扇及空调不要对着吹,少吃冷饮,肩周炎锻炼手上抬、外展、内收或爬墙壁时注意用力幅度,避免拉伤。膝关节疾病少走路尤其爬山多坐车,不受凉!
10、
11、
三甲医院就诊记录:脖子前倾矫正操最先出现在龙鲲博客。
2025-09-30 22:34:16
最近需要在微信读书导入书籍,结果提示PDF太大,于是网上找了挺多PDF的处理工具,不是无法正常运行,就是运行之后直接崩溃,这里记录可以使用的工具,以备日后查阅。
Kun_Tools_0.4.6_正式版.zip(185.2 MB)
开源PDF分割合并工具pdfsam-basic-5.3.0-windows-x64.zip(77.7 MB)
Download
提取码:PEHT
微信读书必备:PDF分割工具最先出现在龙鲲博客。
2025-08-31 17:20:30
之前参加运营商活动,领了1台免费的云电脑和一台低价的云电脑,前段时间解决了云电脑自动休眠的问题,就闲置了下来,最近想着有没有什么方法可以盘活两台云电脑的使用,于是就发现了花生壳的反向穿透服务,经过折腾已实现云电脑当服务器使用,这里简单记录一下,以备日后查阅。
由于云电脑本身没有分配公网IP,所以即使配置相应环境,也无法直接在公网进行访问,这里需要用到花生壳的反向穿透服务。
首先下载宝塔Windows版,安装服务器环境,并新建站点,确保本地浏览器可以直接访问站点(由于云电脑没有公网IP,而宝塔自动生成的面板地址又是IP+路径,这里需要替换为缺省地址127.0.0.1)。
然后注册花生壳账号,并下载软件。在内网穿透中设置相关参数,最后访问花生壳提供的域名即可。
PS:花生壳的账号需要实名认证,并且在试用期过后,需要支付6元进行认证,有效期2099年,除此之外没有其他费用,另外内网穿透后的配置仅适合个人使用(例如月流量1G、带宽1M等)。
利用花生壳搭建云电脑服务器最先出现在龙鲲博客。
2025-08-27 18:13:28
前段时间因为邮寄了解到了传真,于是想有机会尝试一下,最近碰巧有机会,于是进行了尝试,这里简单记录一下,以备日后查阅。
传真的形式主要分为两种,一种是网络传真,一种是传统传真。网络传真顾名思义就是利用互联网来发送传真(个人感觉本质还是传统传真),传统传真就是用原始的非话电信业务来进行传真,但目前不管是网络传真还是机械传真,他们的应用场景都比较有限。
因为家里没有传真机,所以在某宝上找了代发服务(建议选择有营业执照的店铺),价格在5元/页。大概流程是将需要传真的文件扫描后通过邮件发送到对方邮箱,然后等待发送完成,成功后会有一份发送报告。
这里可能有人问了,发送传真这么贵,它有什么优势和好处。个人感觉在不考虑成本的情况下,传真的唯一优势在于,若需要发送的对象未提供电子渠道,能够立马投递给对方。
即使考虑成本,在一些申请事项中(一般申请表+身份证明,总页数在两页),也比较划算。
劣势就在于,若采用传真发送,由于是代发,文件内容可能存在泄露的风险,建议在身份证明上,注明文字标识,表明仅用于此次事项,以及不如EMS特快和挂号信的推定效力要强,所以若使用传真发送,务必电话确认。
2025-08-19 23:16:06
在B站看到一个关于算命的纪录片,里面有一个大家经常见到的街头小游戏,叫不说话知道你姓啥,大概就是给你几张卡片,每张卡片上的名字若干,然后你选一张有你姓氏的,然后把一本小册子盖住地上一块含有你名字的区域,盖住的区域名字大概有十来个,对方就能知道你姓啥。感觉还挺有意思的,于是去了解了一下,原理是用二进制实现了一个算法,于是用AI也写了一个类似的在线版,大家有兴趣可以玩一下。最后,相信科学,反对迷信。
https://lab.lklog.cn/caixingshi/
源码如下:
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>猜姓氏</title> <style> * { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { background: linear-gradient(135deg, #6e8efb, #a777e3); min-height: 100vh; padding: 20px; color: #333; } .container { background: rgba(255, 255, 255, 0.95); border-radius: 20px; box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); padding: 35px; max-width: 1200px; margin: 0 auto; text-align: center; } h1 { color: #4a2bca; margin-bottom: 25px; font-size: 2.5rem; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); position: relative; display: inline-block; } h1::after { content: ''; position: absolute; bottom: -10px; left: 25%; width: 50%; height: 4px; background: linear-gradient(90deg, transparent, #4a2bca, transparent); border-radius: 2px; } .instructions { margin-bottom: 30px; font-size: 1.2rem; line-height: 1.6; color: #555; padding: 0 20px; } .highlight { background: linear-gradient(120deg, #a777e3, #6e8efb); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: bold; } /* 统一网格容器样式 - 一行显示3个 */ .card-container, .large-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin-bottom: 35px; } /* 卡片和区域统一样式 - 确保完全一致 */ .card, .grid-cell { background: white; border-radius: 18px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12); padding: 20px; cursor: pointer; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); position: relative; overflow: hidden; aspect-ratio: 3/4; /* 保持一致的宽高比 */ } .card::before, .grid-cell::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 5px; background: linear-gradient(90deg, #6e8efb, #a777e3); opacity: 0; transition: opacity 0.3s ease; } .card:hover, .grid-cell:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.18); } .card:hover::before, .grid-cell:hover::before { opacity: 1; } .card.selected, .grid-cell.selected { border: 3px solid #4a2bca; transform: scale(1.05); box-shadow: 0 15px 30px rgba(74, 43, 202, 0.2); } .card-title, .grid-title { font-weight: bold; margin-bottom: 15px; color: #4a2bca; font-size: 1.3rem; height: 30px; /* 固定标题高度,确保内容对齐 */ } /* 统一内部网格样式 */ .card-grid, .grid-inner-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(4, 1fr); gap: 10px; height: calc(100% - 45px); /* 精确计算高度,避免溢出 */ } /* 统一姓氏单元格样式 */ .surname-cell, .grid-surname-cell { padding: 8px 5px; background: #f0f4ff; border-radius: 10px; font-size: 0.95rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .large-grid-container { background: #f8faff; border-radius: 18px; padding: 25px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); margin: 20px auto; } .btn { background: linear-gradient(135deg, #6e8efb, #a777e3); color: white; border: none; border-radius: 50px; padding: 16px 40px; font-size: 1.2rem; font-weight: bold; cursor: pointer; transition: all 0.3s ease; margin-top: 25px; } .btn:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(106, 142, 251, 0.6); } .btn:disabled { background: #cccccc; cursor: not-allowed; transform: none; box-shadow: none; } .result { margin-top: 40px; padding: 30px; background: linear-gradient(135deg, #e6f7ff, #f0f4ff); border-radius: 20px; animation: fadeIn 0.6s ease; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .result h2 { color: #4a2bca; margin-bottom: 20px; font-size: 2rem; } .result-surname { font-size: 4.5rem; font-weight: bold; color: #ff6b6b; margin: 20px 0; animation: pulse 1.5s infinite; } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .play-again { background: linear-gradient(135deg, #ff6b6b, #ff8e8e); margin-top: 20px; } .step { display: none; } .step.active { display: block; animation: fadeIn 0.6s ease; } .progress-bar { display: flex; justify-content: space-between; max-width: 400px; margin: 0 auto 40px; position: relative; } .progress-step { width: 40px; height: 40px; border-radius: 50%; background: #ddd; display: flex; align-items: center; justify-content: center; font-weight: bold; color: #777; z-index: 2; } .progress-step.active { background: #4a2bca; color: white; } .progress-step.completed { background: #8a63d2; color: white; } .progress-bar::before { content: ''; position: absolute; top: 50%; left: 20px; right: 20px; height: 6px; background: #ddd; transform: translateY(-50%); z-index: 1; } /* 调试信息样式 */ .debug-info { margin-top: 20px; padding: 10px; background: #f0f0f0; border-radius: 8px; font-size: 0.8rem; color: #666; display: none; } </style> </head> <body> <div class="container"> <h1>猜姓氏</h1> <div class="progress-bar"> <div class="progress-step active">1</div> <div class="progress-step">2</div> <div class="progress-step">结果</div> </div> <div class="step active" id="step1"> <div class="instructions"> <p>请从下面<span class="highlight">9张卡片</span>中选择<span class="highlight">包含您真实姓氏</span>的一张卡片。</p> </div> <div class="card-container" id="cardContainer"> <!-- 卡片将由JavaScript生成 --> </div> <button class="btn" id="nextToStep2" disabled>下一步</button> </div> <div class="step" id="step2"> <div class="instructions"> <p>请从下面<span class="highlight">16个区域</span>中选择<span class="highlight">包含您真实姓氏</span>的区域。</p> </div> <div class="large-grid-container"> <div class="large-grid" id="largeGrid"> <!-- 大网格将由JavaScript生成 --> </div> </div> <button class="btn" id="showResult" disabled>揭晓答案</button> </div> <div class="step" id="step3"> <div class="result"> <h2><a href="https://lklog.cn" target="_blank">龙鲲博客</a>猜出您的姓氏是:</h2> <div class="result-surname" id="resultSurname">?</div> <button class="btn play-again" id="playAgain">再玩一次</button> </div> </div> <!-- 调试信息区域 --> <div class="debug-info" id="debugInfo"></div> </div> <script> document.addEventListener('DOMContentLoaded', function() { // 重新设计的姓氏数据结构 - 确保每个(card, grid)组合唯一 const surnameData = { // 卡片0 (第一张卡片) 上的姓氏 "李": {card: 0, grid: 0}, "王": {card: 0, grid: 1}, "张": {card: 0, grid: 2}, "刘": {card: 0, grid: 3}, "陈": {card: 0, grid: 4}, "杨": {card: 0, grid: 5}, "赵": {card: 0, grid: 6}, "黄": {card: 0, grid: 7}, "周": {card: 0, grid: 8}, "吴": {card: 0, grid: 9}, "徐": {card: 0, grid: 10}, "孙": {card: 0, grid: 11}, "胡": {card: 0, grid: 12}, "朱": {card: 0, grid: 13}, "高": {card: 0, grid: 14}, "林": {card: 0, grid: 15}, // 卡片1 (第二张卡片) 上的姓氏 "何": {card: 1, grid: 0}, "郭": {card: 1, grid: 1}, "马": {card: 1, grid: 2}, "罗": {card: 1, grid: 3}, "梁": {card: 1, grid: 4}, "宋": {card: 1, grid: 5}, "郑": {card: 1, grid: 6}, "谢": {card: 1, grid: 7}, "韩": {card: 1, grid: 8}, "唐": {card: 1, grid: 9}, "冯": {card: 1, grid: 10}, "于": {card: 1, grid: 11}, "董": {card: 1, grid: 12}, "萧": {card: 1, grid: 13}, "程": {card: 1, grid: 14}, "曹": {card: 1, grid: 15}, // 卡片2 (第三张卡片) 上的姓氏 "袁": {card: 2, grid: 0}, "邓": {card: 2, grid: 1}, "许": {card: 2, grid: 2}, "傅": {card: 2, grid: 3}, "沈": {card: 2, grid: 4}, "曾": {card: 2, grid: 5}, "彭": {card: 2, grid: 6}, "吕": {card: 2, grid: 7}, "苏": {card: 2, grid: 8}, "卢": {card: 2, grid: 9}, "蒋": {card: 2, grid: 10}, "蔡": {card: 2, grid: 11}, "贾": {card: 2, grid: 12}, "丁": {card: 2, grid: 13}, "魏": {card: 2, grid: 14}, "薛": {card: 2, grid: 15}, // 卡片3 (第四张卡片) 上的姓氏 "叶": {card: 3, grid: 0}, "阎": {card: 3, grid: 1}, "余": {card: 3, grid: 2}, "潘": {card: 3, grid: 3}, "杜": {card: 3, grid: 4}, "戴": {card: 3, grid: 5}, "夏": {card: 3, grid: 6}, "锺": {card: 3, grid: 7}, "汪": {card: 3, grid: 8}, "田": {card: 3, grid: 9}, "任": {card: 3, grid: 10}, "姜": {card: 3, grid: 11}, "范": {card: 3, grid: 12}, "方": {card: 3, grid: 13}, "石": {card: 3, grid: 14}, "姚": {card: 3, grid: 15}, // 卡片4 (第五张卡片) 上的姓氏 "谭": {card: 4, grid: 0}, "廖": {card: 4, grid: 1}, "邹": {card: 4, grid: 2}, "熊": {card: 4, grid: 3}, "金": {card: 4, grid: 4}, "陆": {card: 4, grid: 5}, "郝": {card: 4, grid: 6}, "孔": {card: 4, grid: 7}, "白": {card: 4, grid: 8}, "崔": {card: 4, grid: 9}, "康": {card: 4, grid: 10}, "毛": {card: 4, grid: 11}, "邱": {card: 4, grid: 12}, "秦": {card: 4, grid: 13}, "江": {card: 4, grid: 14}, "史": {card: 4, grid: 15}, // 卡片5 (第六张卡片) 上的姓氏 "顾": {card: 5, grid: 0}, "侯": {card: 5, grid: 1}, "邵": {card: 5, grid: 2}, "孟": {card: 5, grid: 3}, "龙": {card: 5, grid: 4}, "万": {card: 5, grid: 5}, "段": {card: 5, grid: 6}, "雷": {card: 5, grid: 7}, "钱": {card: 5, grid: 8}, "汤": {card: 5, grid: 9}, "尹": {card: 5, grid: 10}, "黎": {card: 5, grid: 11}, "易": {card: 5, grid: 12}, "常": {card: 5, grid: 13}, "武": {card: 5, grid: 14}, "乔": {card: 5, grid: 15}, // 卡片6 (第七张卡片) 上的姓氏 "贺": {card: 6, grid: 0}, "赖": {card: 6, grid: 1}, "龚": {card: 6, grid: 2}, "文": {card: 6, grid: 3}, "庞": {card: 6, grid: 4}, "樊": {card: 6, grid: 5}, "兰": {card: 6, grid: 6}, "殷": {card: 6, grid: 7}, "施": {card: 6, grid: 8}, "陶": {card: 6, grid: 9}, "洪": {card: 6, grid: 10}, "翟": {card: 6, grid: 11}, "安": {card: 6, grid: 12}, "颜": {card: 6, grid: 13}, "倪": {card: 6, grid: 14}, "严": {card: 6, grid: 15}, // 卡片7 (第八张卡片) 上的姓氏 "牛": {card: 7, grid: 0}, "温": {card: 7, grid: 1}, "芦": {card: 7, grid: 2}, "季": {card: 7, grid: 3}, "俞": {card: 7, grid: 4}, "章": {card: 7, grid: 5}, "鲁": {card: 7, grid: 6}, "葛": {card: 7, grid: 7}, "伍": {card: 7, grid: 8}, "韦": {card: 7, grid: 9}, "申": {card: 7, grid: 10}, "尤": {card: 7, grid: 11}, "毕": {card: 7, grid: 12}, "聂": {card: 7, grid: 13}, "丛": {card: 7, grid: 14}, "焦": {card: 7, grid: 15}, // 卡片8 (第九张卡片) 上的姓氏 "向": {card: 8, grid: 0}, "柳": {card: 8, grid: 1}, "邢": {card: 8, grid: 2}, "路": {card: 8, grid: 3}, "岳": {card: 8, grid: 4}, "齐": {card: 8, grid: 5}, "梅": {card: 8, grid: 6}, "莫": {card: 8, grid: 7}, "庄": {card: 8, grid: 8}, "辛": {card: 8, grid: 9}, "管": {card: 8, grid: 10}, "祝": {card: 8, grid: 11}, "左": {card: 8, grid: 12}, "涂": {card: 8, grid: 13}, "谷": {card: 8, grid: 14}, "时": {card: 8, grid: 15} }; // 游戏状态 const gameState = { selectedCard: null, // 选中的卡片索引 selectedGrid: null, // 选中的区域索引 allSurnames: Object.keys(surnameData) // 所有姓氏列表 }; // 验证数据完整性和唯一性 function validateSurnameData() { const cardCounts = Array(9).fill(0); const gridCounts = Array(16).fill(0); const combinations = new Set(); const errors = []; // 检查每个卡片和区域是否有正确数量的姓氏 for (const surname in surnameData) { const {card, grid} = surnameData[surname]; cardCounts[card]++; gridCounts[grid]++; // 检查组合唯一性 const key = `${card},${grid}`; if (combinations.has(key)) { errors.push(`组合 (卡片${card + 1}, 区域${grid + 1}) 不唯一,被多个姓氏使用`); } combinations.add(key); } // 检查卡片姓氏数量 (应为16个) cardCounts.forEach((count, index) => { if (count !== 16) { errors.push(`卡片 ${index + 1} 姓氏数量错误: 应有16个,实际有${count}个`); } }); // 检查区域姓氏数量 (应为9个) gridCounts.forEach((count, index) => { if (count !== 9) { errors.push(`区域 ${index + 1} 姓氏数量错误: 应有9个,实际有${count}个`); } }); // 显示调试信息 const debugInfo = document.getElementById('debugInfo'); if (errors.length === 0) { debugInfo.textContent = "数据验证通过: 所有卡片各有16个姓氏,所有区域各有9个姓氏,所有组合唯一"; } else { debugInfo.textContent = "数据验证错误:\n" + errors.join("\n"); } return errors.length === 0; } // 生成卡片(第一步) function generateCards() { const cardContainer = document.getElementById('cardContainer'); cardContainer.innerHTML = ''; // 为每张卡片(0-8)生成内容 for (let cardIndex = 0; cardIndex < 9; cardIndex++) { const card = document.createElement('div'); card.className = 'card'; card.dataset.index = cardIndex; // 卡片标题 const title = document.createElement('div'); title.className = 'card-title'; title.textContent = `卡片 ${cardIndex + 1}`; card.appendChild(title); // 姓氏网格 const grid = document.createElement('div'); grid.className = 'card-grid'; // 收集该卡片上的所有姓氏 const cardSurnames = []; for (const surname in surnameData) { if (surnameData[surname].card === cardIndex) { cardSurnames.push(surname); } } // 填充4x4网格 (确保16个) for (let i = 0; i < 16; i++) { const cell = document.createElement('div'); cell.className = 'surname-cell'; cell.textContent = cardSurnames[i]; grid.appendChild(cell); } card.appendChild(grid); // 添加点击事件 card.addEventListener('click', () => { toggleCardSelection(cardIndex); }); cardContainer.appendChild(card); } } // 切换卡片选择状态 function toggleCardSelection(cardIndex) { if (gameState.selectedCard === cardIndex) { gameState.selectedCard = null; document.querySelectorAll('.card').forEach(card => { card.classList.remove('selected'); }); } else { gameState.selectedCard = cardIndex; document.querySelectorAll('.card').forEach((card, idx) => { card.classList.toggle('selected', idx === cardIndex); }); } document.getElementById('nextToStep2').disabled = gameState.selectedCard === null; } // 生成区域(第二步) function generateLargeGrid() { const largeGrid = document.getElementById('largeGrid'); largeGrid.innerHTML = ''; // 修改为4x4网格布局 largeGrid.style.gridTemplateColumns = 'repeat(4, 1fr)'; // 为每个区域(0-15)生成内容 for (let gridIndex = 0; gridIndex < 16; gridIndex++) { const cell = document.createElement('div'); cell.className = 'grid-cell'; cell.dataset.index = gridIndex; // 区域标题 const title = document.createElement('div'); title.className = 'grid-title'; title.textContent = `区域 ${gridIndex + 1}`; cell.appendChild(title); // 姓氏网格 - 使用3x3网格,因为每个区域有9个姓氏 const innerGrid = document.createElement('div'); innerGrid.className = 'card-grid'; innerGrid.style.gridTemplateColumns = 'repeat(3, 1fr)'; innerGrid.style.gridTemplateRows = 'repeat(3, 1fr)'; // 收集该区域上的所有姓氏 const gridSurnames = []; for (const surname in surnameData) { if (surnameData[surname].grid === gridIndex) { gridSurnames.push(surname); } } // 填充3x3网格 (确保9个) for (let i = 0; i < 9; i++) { const surnameCell = document.createElement('div'); surnameCell.className = 'surname-cell'; surnameCell.textContent = gridSurnames[i]; innerGrid.appendChild(surnameCell); } cell.appendChild(innerGrid); // 添加点击事件 cell.addEventListener('click', () => { toggleGridSelection(gridIndex); }); largeGrid.appendChild(cell); } } // 切换区域选择状态 function toggleGridSelection(gridIndex) { if (gameState.selectedGrid === gridIndex) { gameState.selectedGrid = null; document.querySelectorAll('.grid-cell').forEach(cell => { cell.classList.remove('selected'); }); } else { gameState.selectedGrid = gridIndex; document.querySelectorAll('.grid-cell').forEach((cell, idx) => { cell.classList.toggle('selected', idx === gridIndex); }); } document.getElementById('showResult').disabled = gameState.selectedGrid === null; } // 根据选择的卡片和区域猜测姓氏 function guessSurname() { for (const surname in surnameData) { const data = surnameData[surname]; if (data.card === gameState.selectedCard && data.grid === gameState.selectedGrid) { return surname; } } return "未知"; } // 初始化游戏事件监听 function initEventListeners() { // 下一步按钮 document.getElementById('nextToStep2').addEventListener('click', () => { document.getElementById('step1').classList.remove('active'); document.getElementById('step2').classList.add('active'); // 更新进度条 document.querySelectorAll('.progress-step')[0].classList.add('completed'); document.querySelectorAll('.progress-step')[1].classList.add('active'); // 生成区域网格 generateLargeGrid(); }); // 揭晓答案按钮 document.getElementById('showResult').addEventListener('click', () => { document.getElementById('step2').classList.remove('active'); document.getElementById('step3').classList.add('active'); // 更新进度条 document.querySelectorAll('.progress-step')[1].classList.add('completed'); document.querySelectorAll('.progress-step')[2].classList.add('active'); // 显示结果 const resultElement = document.getElementById('resultSurname'); resultElement.textContent = '思考中...'; setTimeout(() => { resultElement.textContent = guessSurname(); }, 1000); }); // 再玩一次按钮 document.getElementById('playAgain').addEventListener('click', () => { // 重置游戏状态 gameState.selectedCard = null; gameState.selectedGrid = null; // 重置界面 document.getElementById('step3').classList.remove('active'); document.getElementById('step1').classList.add('active'); // 重置进度条 document.querySelectorAll('.progress-step').forEach(step => { step.classList.remove('active', 'completed'); }); document.querySelectorAll('.progress-step')[0].classList.add('active'); // 重新生成卡片 generateCards(); // 禁用按钮 document.getElementById('nextToStep2').disabled = true; document.getElementById('showResult').disabled = true; }); } // 初始化游戏 function initGame() { // 验证数据 validateSurnameData(); // 生成卡片 generateCards(); // 初始化事件监听 initEventListeners(); } // 启动游戏 initGame(); }); </script> </body> </html>
不说话知道你姓啥在线版(附源码)最先出现在龙鲲博客。