JavaScript中使用带prompt的while语句点击Cancel结果异常如何修复

问题根因 #

• 触发异常表现的核心原因是prompt方法的返回值规则：点击「取消」按钮时，prompt会返回null，而非用户输入内容/空字符串
• 你当前的循环逻辑里，拿到prompt返回值后没有做数值转换，直接赋值给myGrade判断isNaN(myGrade)：而isNaN(null)的执行结果是false（JS隐式转换会把null转成数值0，0是合法数值），直接跳出了循环，后续判断逻辑自然会返回C及以下的结果
• 这个问题和你用parseFloat还是parseInt无关，不需要替换成parseInt，问题出在返回值处理逻辑缺失。

修复方案 #

你可以根据需求选择两种处理逻辑：

方案1：支持取消操作，用户点取消后直接终止流程 #

function checkGrade(form) {
  var myGrade = parseFloat(form.myText.value);

  while (isNaN(myGrade)) {
    const input = prompt("Enter a numerical grade value:", "")
    // 处理点击取消的场景
    if (input === null) {
      alert("已取消成绩查询");
      return; // 直接终止函数执行，不进入后续成绩判断
    }
    // 把用户输入转成浮点数再赋值
    myGrade = parseFloat(input);
  }

  if (myGrade >= 91) {
    alert("Your grade is an A.");
  } else if (myGrade >= 81 && myGrade <= 90) {
    alert("Your grade is a B.");
  } else {
    alert("Your grade is a C or lower.");
  }
}

方案2：不支持取消，要求用户必须输入有效数值才能继续 #

如果不需要取消功能，强制用户必须输入合法数值才能退出弹窗，只需统一对prompt返回值做数值转换即可：

function checkGrade(form) {
  var myGrade = parseFloat(form.myText.value);

  while (isNaN(myGrade)) {
    // 直接把prompt返回值转成浮点数再赋值
    myGrade = parseFloat(prompt("Enter a numerical grade value:", ""))
  }

  // 后续成绩判断逻辑不变
  if (myGrade >= 91) {
    alert("Your grade is an A.");
  } else if (myGrade >= 81 && myGrade <= 90) {
    alert("Your grade is a B.");
  } else {
    alert("Your grade is a C or lower.");
  }
}

这种写法下用户点击取消时，parseFloat(null)会返回NaN，循环会持续触发弹窗，不会进入后续判断逻辑。

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