模板:Encounter.js

/**
 * 万隙之墟 - 奇遇节点交互脚本
 * 功能：点击选项后隐藏同级其他选项，显示结果；支持重置全部状态。
 */
(function() {
    // 等待DOM加载完成
    function init() {
        // 为所有奇遇节点绑定事件委托
        document.querySelectorAll('.encounter-node').forEach(function(node) {
            bindNodeEvents(node);
        });
    }

    function bindNodeEvents(node) {
        // 重置按钮
        var resetBtn = node.querySelector('.reset-button');
        if (resetBtn) {
            resetBtn.addEventListener('click', function(e) {
                e.stopPropagation();
                resetNode(node);
            });
        }

        // 事件委托：处理所有 .option-trigger 的点击
        node.addEventListener('click', function(e) {
            var trigger = e.target.closest('.option-trigger');
            if (!trigger) return;
            e.preventDefault();
            e.stopPropagation();

            var optionItem = trigger.closest('.option-item');
            if (!optionItem) return;

            // 如果该选项已经显示结果，不再重复处理（可选，可根据需求允许重新选择？这里设计为只能选一次）
            if (optionItem.classList.contains('chosen')) return;

            // 隐藏该 optionItem 所在的层级中的所有其他 .option-item（同级）
            var parentContainer = optionItem.parentNode;
            var siblings = parentContainer.querySelectorAll(':scope > .option-item');
            siblings.forEach(function(sib) {
                if (sib !== optionItem) {
                    sib.style.display = 'none';
                }
            });

            // 标记当前选项为已选
            optionItem.classList.add('chosen');

            // 显示该选项对应的 result
            var resultDiv = optionItem.querySelector('.option-result');
            if (resultDiv) {
                resultDiv.style.display = 'block';
            }

            // 可选：如果结果中还有子选项，子选项的触发需要再次绑定（但事件委托已覆盖，无需额外操作）
        });
    });