如何让函数按照用户下拉框选择的次数重复执行
解决方案
核心思路是新增2个全局状态变量记录称重进度,尽量少改动原有逻辑,符合你可修改范围小的要求。
第一步:新增全局状态变量
放在JS代码最顶部即可:
// 剩余需要称重的次数,0表示未开启多件称重 let remainingWeighTimes = 0 // 标记是否为多件称重的后续轮次 let isSubsequentRound = false
第二步:修改getScales函数
function getScales() { // 后续轮次直接跳过弹窗,仅执行称重逻辑 if (isSubsequentRound) { // 此处保留你原有getScales中除了getOrderData之外的称重核心代码 // 称重完成后更新剩余次数 remainingWeighTimes-- if (remainingWeighTimes > 0) { // 还有未完成的称重,直接触发下一次,不需要用户点击continue setTimeout(() => getScales(), 300) // 加短延时避免秤接口调用过频,不需要可删除 } else { // 全部称重完成,重置状态 isSubsequentRound = false } return } // 首次运行走原有逻辑,弹出选择数量的弹窗 getOrderData() }
第三步:修改getOrderData函数
function getOrderData() { // 你原有填充弹窗的逻辑全部保留不动 // 新增:初始化下拉选项(请提前在弹窗的HTML中添加id为numOfPieces的select元素) const select = document.getElementById("numOfPieces"); // 先清空原有选项,避免重复追加 select.innerHTML = '' const options = ["1", "2", "3", "4", "5"]; for(let i = 0; i < options.length; i++) { const opt = options[i]; const el = document.createElement("option"); el.textContent = opt; el.value = opt; select.appendChild(el); } // 你原有弹窗的其他校验、展示逻辑全部保留不动 }
第四步:修改continue按钮点击事件
$(document).ready(function () { $("#continue").click(function () { // 获取用户选择的称重次数 const selectedTimes = Number(document.getElementById("numOfPieces").value) if (selectedTimes === 1) { // 选1走原有逻辑 getScales() } else { // 选多件时设置状态:剩余次数为总次数减1(首次已经触发) remainingWeighTimes = selectedTimes - 1 isSubsequentRound = true // 执行第一次称重 getScales() } }) });
注意事项
- 如果你的称重逻辑是异步接口请求,请将
remainingWeighTimes--的逻辑放到异步请求的成功回调中,避免次数更新时机错误 - 若原有
getScales中包含除getOrderData之外的业务逻辑,请完整复制到后续轮次的判断分支中
内容的提问来源于stack exchange,提问作者Maroun
相关产品推荐
相关产品推荐

