微件:配队模拟器

<script> (function() {

   // 等待DOM加载完成
   function initTeamSimulator() {
       // 点击角色槽位显示选择窗口
       document.getElementById('character-slot').addEventListener('click', function() {
           document.getElementById('character-modal').style.display = 'block';
       });
       
       // 关闭角色选择窗口
       document.getElementById('close-character-modal').addEventListener('click', function() {
           document.getElementById('character-modal').style.display = 'none';
       });
       
       // 点击遮罩层关闭窗口
       document.getElementById('character-modal').addEventListener('click', function(e) {
           if (e.target === this) {
               this.style.display = 'none';
           }
       });
       
       // 选择角色 - 使用事件委托
       document.getElementById('character-list').addEventListener('click', function(e) {
           var characterOption = e.target.closest('.character-option');
           if (characterOption) {
               // 克隆整个角色卡片
               var clonedCard = characterOption.cloneNode(true);
               
               // 移除点击事件相关的类和样式
               clonedCard.classList.remove('character-option');
               clonedCard.style.cursor = 'default';
               clonedCard.style.transition = 'none';
               clonedCard.style.margin = '0';
               
               // 清空槽位并添加克隆的卡片
               var characterSlot = document.getElementById('character-slot');
               characterSlot.innerHTML = ;
               characterSlot.appendChild(clonedCard);
               characterSlot.style.border = 'none';
               characterSlot.style.padding = '0';
               characterSlot.style.display = 'block';
               
               // 关闭选择窗口
               document.getElementById('character-modal').style.display = 'none';
           }
       });
   }
   
   // 确保DOM加载完成后执行
   if (document.readyState === 'loading') {
       document.addEventListener('DOMContentLoaded', initTeamSimulator);
   } else {
       initTeamSimulator();
   }

})(); </script>

<style> .character-option:hover {

   transform: scale(1.05);
   box-shadow: 0 4px 8px rgba(0,0,0,0.2);

}

1. character-slot .character-option:hover {

   transform: none !important;
   box-shadow: none !important;

} </style>