商场地图指引功能HTML与JS代码运行异常问题咨询

根因分析 #

• 未弹出最近门店询问框：你在if判断成立的代码块中，将return true放在了所有业务逻辑最前端，函数执行到return语句会直接终止并返回结果，后续的prompt、alert代码完全不会被运行。
• 字符串匹配逻辑失效：if条件中错误使用了赋值运算符=，而非相等判断运算符。该语句会直接把destination1的值强制覆盖为'Target'，无论用户输入任何内容，条件都会判定为成立，匹配逻辑完全不生效。同时未对用户输入的首尾空格做处理，用户误输入空格也会导致正常匹配失败。

修复后完整代码 #

<!DOCTYPE html>
<html>
<head>
  <title>商场内部导航</title>
  <script>
    function demoA() {
      const targetStore = 'Target';
      const destination1 = prompt("Enter Your Destination", " ");
      // 处理用户点击取消的边界情况
      if (!destination1) return false;
      // 去除输入首尾空格后做严格相等判断
      if (destination1.trim() === targetStore) {
        const location2 = prompt("Enter Your Closest Store", " ");
        if (location2) {
          alert("Starting Directions to " + destination1);
        }
        // 所有逻辑执行完成后再返回
        return true;
      } else {
        return false;
      }
    }
  </script>
</head>
<body>
  <input type="button" value="Directions" onclick="demoA()" />
</body>
</html>

调整点说明 #

1. 调整了return true的位置，放在if块所有业务逻辑执行完成后，保证引导逻辑正常运行
2. 把if条件的赋值运算符替换为严格相等运算符===，同时对用户输入调用trim()方法去除首尾空格，避免输入误差导致匹配失败
3. 补充了用户点击prompt取消按钮的边界情况处理，避免空值导致后续逻辑异常

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