• 改了函数以后,一个数字都不显示了


    let currentQuestionIndex = 0;
    const questions = [];
     
    function addOrSubtract(num1, num2, operator) {
      return operator === '+' ? num1 + num2 : Math.max(0, num1 - num2); // 使用Math.max确保结果不为负
    }
     
    function displayQuestion(question) {
      document.getElementById('question').textContent = question;
    }
     
    function generateQuestion() {
      const operators = ['+', '-'];
      let question = '';
      for (let i = 0; i < 3; i++) {
        const number = Math.floor(Math.random() * 4) + 1; // 1-4的随机数
        const operator = i < 2 ? operators[Math.floor(Math.random() * 2)] : '';
     
        // 立即更新问题显示
        displayQuestion(question += operator + number);
     
        if (operator !== '') { // 如果有运算符,添加空格
          displayQuestion(question += ' ');
        }
     
        setTimeout(() => {
          // 在这里计算答案,因为我们需要当前的问题字符串
          const answer = addOrSubtract(addOrSubtract(questions[questions.length - 1] ? questions[questions.length - 1].answer : 0, parseInt(number), operator), number, operator);
          
          questions.push({ question: question, answer: answer.toString() });
     
          // 只在最后一轮结束后清空问题显示
          if (i === 2) {
            displayQuestion('');
          }
        }, (i + 1) * 1000);
      }
    }
     
    function checkAnswer() {
      const userAnswer = parseInt(document.getElementById('answerInput').value);
      if (userAnswer === questions[currentQuestionIndex].answer) {
        alert('正确!');
      } else {
        alert('错误,正确答案是: ' + questions[currentQuestionIndex].answer);
      }
      document.getElementById('answerInput').value = '';
      if (currentQuestionIndex < 2) {
        currentQuestionIndex++;
        document.getElementById('question').textContent = '';
        generateQuestion();
      } else {
        alert('所有题目已完成!');
      }
    }
     
    // 初始化第一题
    generateQuestion();
    
    ="100%" border="0" cellpadding="0" cellspacing="0">
                ="STYLE2">
                  ="STYLE2">
                  ="STYLE2">
                  
    ="60" align="center" style="font-size: 50px; line-height: 60px; padding-top: 15px;">
    ="question">
    ="150" align="center" style="font-size: 20px; line-height: 30px;">="text" id="answerInput" placeholder="输入答案">
    ="300" align="center">

    下面是原来的generateQuestion()函数,结果会为负数,但还能显示数字,为了结果不为负数,改成上面generateQuestion()函数后,怎么一个数字都不显示了?

    function generateQuestion() {
        const operators = ['+', '-'];
        let question = '';
        for (let i = 0; i < 3; i++) {
            const number = Math.floor(Math.random() * 4) + 1; // 1-4的随机数
            const operator = i < 2 ? operators[Math.floor(Math.random() * 2)] : '';
            setTimeout(() => {
                document.getElementById('question').textContent = number + (i < 2 ? operator : '');
            }, (i + 1) * 1000);
            question += number + (i < 2 ? operator : '');
        }
        questions.push({ question: question, answer: eval(question) });
    }
    

    展开全部

    • 阿里嘎多学长 2024-06-03 23:01
      关注

      以下内容由CHATGPT及阿里嘎多学长共同生成、有用望采纳:


      根据你提供的代码和问题描述,出现数字不再显示在页面上的原因可能与generateQuestion函数中的setTimeout回调函数和displayQuestion函数的调用方式有关。下面是针对你提到的检查点的分析和建议:

      1. displayQuestion函数

        • 这个函数看起来是正确的,它接收一个字符串参数并将其设置为页面上question元素的文本内容。
      2. generateQuestion函数中的setTimeout回调函数

        • 在你的新代码中,你使用了多个setTimeout来逐步显示问题。问题可能出在setTimeout回调函数中,特别是你是如何构建question字符串的。
        • 在你的新代码中,displayQuestion(question += operator + number);这一行在每次循环时都会立即调用displayQuestion,但是此时question字符串还没有完全构建完成,因此可能在页面上显示不完整的问题。
      3. addOrSubtract函数

        • 这个函数看起来是正确的,它根据运算符+-来计算结果,并使用Math.max确保结果不为负。
      4. questions数组和currentQuestionIndex

        • 从代码中看不出questions数组和currentQuestionIndex有什么问题。它们应该能够正确地存储问题和答案,并指向当前问题。
      5. checkAnswer函数

        • 这个函数看起来也是正确的,它能够验证用户的答案,并在需要时更新到下一个问题。

      解决方案

      • 你需要确保question字符串在setTimeout回调函数中完全构建完成后再显示。你可以通过将displayQuestion的调用放在setTimeout的最后,确保问题完全构建后再显示。
      • 另外,你的setTimeout回调函数中计算答案的方式可能有问题。你需要确保在计算答案时使用的是最终构建完成的question字符串。

      下面是修改后的generateQuestion函数示例:

      function generateQuestion() {
        const operators = ['+', '-'];
        let question = '';
        for (let i = 0; i < 3; i++) {
          const number = Math.floor(Math.random() * 4) + 1;
          const operator = i < 2 ? operators[Math.floor(Math.random() * 2)] : '';
          question += (i > 0 ? ' ' : '') + number + (i < 2 ? ' ' + operator : '');
      
          setTimeout(() => {
            displayQuestion(question);
            // 计算答案的逻辑需要调整,确保使用完整的question字符串
            const finalNumber = i === 2 ? number : 0; // 如果是最后一个数字,才加入计算
            const answer = addOrSubtract(addOrSubtract(questions[questions.length - 1] ? questions[questions.length - 1].answer : 0, parseInt(number), operator), finalNumber, operator);
            questions.push({ question: question, answer: answer.toString() });
      
            // 只在最后一轮结束后清空问题显示
            if (i === 2) {
              displayQuestion('');
            }
          }, (i + 1) * 1000);
        }
      }
      

      请注意,这个解决方案假设你的addOrSubtract函数能够正确处理构建完成的question字符串。如果问题仍然存在,你可能需要进一步调试addOrSubtract函数来确保它能够正确计算答案。

      至于参考资料,你可以查看以下资源来了解更多关于JavaScript定时器和字符串处理的信息:

      希望这些信息能够帮助你解决问题。如果还有其他问题或需要进一步的帮助,请随时提问。

      展开全部

      本回答被题主选为最佳回答 , 对您是否有帮助呢?
  • 相关阅读:
    .net lambda表达式合并
    ue5 右击.uproject generator vs project file 错误
    AI内容生成时代:该如何和AI对话?
    linux 通过拷贝所有oracle文件进行数据库恢复
    Quartz 的关键接口详解
    k8s学习笔记4-基础部分pod探针
    RabbitMQ的常见工作模式
    cg 201909-1
    ping不通Linux服务器怎么办?
    【leetcode】按奇偶排序数组 c++
  • 原文地址:https://ask.csdn.net/questions/8113602