javascript - 点击按钮不执行功能

Question

• 我尝试单击 btn3 ( kashef) 并且它没有触发我的函数 kashef()

  我的代码在这里：https ://jsfiddle.net/erezdav12/gn8shkrm/100/

• 我需要通过单击 kashef 按钮，我的运行计数器（它是一个点钞机）将减去，比如说，300 美元（点击以获取该功能的成本）例如：如果在点击的那一刻钱滚轮是 1000 美元“kashef”按钮上的事件，货币计数器减少到 700 $ 并继续运行直到下一次点击。

这是代码：

    let start; 
    const el = document.getElementById('count');  
    const final = parseInt(el.textContent, 10);  
    const duration = 100000;  
    
    const kashefButton= document.getElementById("btn3");
    kashefButton.addEventListener("click", kashef);
    
    function kashef(){
    
    document.getElementById('count').innerHTML=1000-300;
    
    }
     
    
    const step = ts => {
      if (!start) {
        start = ts;
      }
       
      let progress = (ts - start) / duration;
      el.textContent = Math.floor(progress * final) * 100 ; 
      time = +el.textContent;
      if( progress < 1){
        requestAnimationFrame(step);
      }
    
      var btn1 = document.getElementById('btn1');
      var btn2 = document.getElementById('btn2');
      var btn3 = document.getElementById('btn3'); 
    
      const OpentButtons = 200;
    
    
      if (time <= OpentButtons) {
        btn1.disabled = true;
        btn2.disabled = true;
        btn3.disabled = true;
    
      } else {
        btn1.disabled = false;
        btn2.disabled = false;
        btn3.disabled = false;
      }
    
    }
    requestAnimationFrame(step);

非常感谢 ！！！！

标签： javascripthtml

Answer 1

这是一个范围界定问题。kashdef 的定义未在事件侦听器可以找到它的范围内定义。将 kashef 的定义移到 ts 块之外（就在 "const duration = 100001;" 之后）并且它可以工作（在你的小提琴中验证）。