JavaScript程序二次调用chooseType方法后停止执行问题求助

你的代码核心问题在于：页面加载时会执行一次chooseType()并打印初始值，但下拉框切换时，onchange仅调用chooseType()返回值，没有触发后续的判断和打印逻辑，所以你看不到切换后的输出，并非程序停止执行。

另外，当前下拉框的value是"1"和"2"，但你实际需要的是"letter"或"package"，这也需要修正。

修正后的代码示例 #

HTML部分（修正option的value）

<form autocomplete="off">
  <label for="selectPackageType">Type:</label>
  <select id="selectPackageType">
    <option value="letter">letter</option>
    <option value="package">package</option>
  </select>
</form>

JavaScript部分（重构逻辑，统一处理初始化和切换事件）

// 生成随机PackageId
let generateID = () => {
  return Math.random().toString(36).slice(2);
};

// 获取下拉框元素
const packageTypeSelect = document.getElementById("selectPackageType");

// 处理包裹类型的逻辑（包含取值、判断、打印）
let handlePackageType = () => {
  const typeOfPackage = packageTypeSelect.value;
  if (!typeOfPackage) {
    console.log("包裹类型为空");
  } else {
    console.log(typeOfPackage);
  }
  return typeOfPackage;
};

// 初始化生成ID并打印
const randomID = generateID();
console.log(randomID);

// 页面加载时先执行一次，打印初始类型
handlePackageType();

// 下拉框切换时触发处理逻辑
packageTypeSelect.onchange = handlePackageType;

关键修改点 #

• 将判断和打印逻辑封装到handlePackageType函数中，确保初始化和切换时都会执行完整逻辑
• 修正下拉框option的value为实际需要的类型字符串（"letter"/"package"），避免后续还要做值映射
• 用const替代不必要的var，符合现代JS规范
• 页面初始化时主动调用handlePackageType，确保初始状态也有输出

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