点击按钮递增计数器异常求助：始终弹出‘odd’提示

核心问题 #

你的代码存在三个关键问题：

1. 执行时机错误：奇偶判断代码在添加点击监听后立即执行，此时还未发生点击，elementClicked始终为初始值0，因此只会弹出"odd"，且后续点击不会触发判断逻辑。
2. 变量作用域问题：elementClicked定义在函数内部，每次触发auto_Unfold_tapareaAction都会被重置为0，无法保留点击计数。
3. 奇偶判断逻辑颠倒：elementClicked % 2 == 0代表偶数，却弹出"odd"（奇数），逻辑完全相反。

修正方案 #

以下是两种可行的修复方式：

方案一：使用外部变量保留计数状态

// 将计数器变量放在函数外部，确保状态在多次触发中持续保留
let elementClicked = 0;

gwd.auto_Unfold_tapareaAction = function(event) {
  const clickarea = document.getElementById('unfold_taparea');
  
  function handleIncrement() {
    elementClicked++;
    // 修正奇偶判断逻辑，将判断放在点击回调内，每次点击后执行
    if (elementClicked % 2 === 0) {
      alert("even");
    } else {
      alert("odd");
    }
  };
  
  // 移除旧监听避免重复绑定（若该函数可能被多次调用）
  clickarea.removeEventListener('click', handleIncrement, true);
  clickarea.addEventListener('click', handleIncrement, true);
};

方案二：使用元素自定义属性存储计数（无需外部变量）

gwd.auto_Unfold_tapareaAction = function(event) {
  const clickarea = document.getElementById('unfold_taparea');
  
  // 从元素dataset初始化计数器，未定义则设为0
  clickarea.dataset.clickCount = clickarea.dataset.clickCount || '0';
  
  function handleIncrement() {
    // 递增计数并更新到元素属性
    const count = parseInt(clickarea.dataset.clickCount, 10) + 1;
    clickarea.dataset.clickCount = count;
    
    // 执行正确的奇偶判断
    alert(count % 2 === 1 ? "odd" : "even");
  };
  
  // 移除旧监听避免重复绑定
  clickarea.removeEventListener('click', handleIncrement, true);
  clickarea.addEventListener('click', handleIncrement, true);
};

关键说明 #

• 将奇偶判断逻辑移至点击回调函数内，确保每次点击后才执行判断。
• 修正了奇偶判断的逻辑颠倒问题，保证提示内容与计数的奇偶性匹配。
• 添加了removeEventListener避免重复绑定事件（若auto_Unfold_tapareaAction可能被多次触发）。

内容的提问来源于stack exchange，提问作者Louis Havet