Laravel循环生成的select绑定jQuery change()仅首个生效如何解决？

问题根因 #

• 事件回调中用$('.wifi').attr("data-repeat")写法错误：当选择器匹配多个同class元素时，attr()方法只会返回第一个匹配元素的属性值，所以不管你操作哪个下拉框，永远只会读取第一个下拉框的data-repeat值，导致后续下拉框逻辑完全不生效。
• 原有累加逻辑存在缺陷：只维护了一个全局的comision_total_wifi变量，每次切换选中项只会覆盖该值，无法正确统计多个下拉框的佣金总和。

修正方案 #

推荐采用遍历重算的方式，逻辑更简单不易出错，每次任意下拉框变更时，统一统计所有已选中下拉框的佣金值求和即可：

var comision = $('.comision_total');

$('.wifi').change(function () {
    let comision_total = 0;
    // 遍历所有wifi下拉框，累加已选中的佣金
    $('.wifi').each(function() {
        const selectedCom = $(this).find(':selected').data('comission');
        if (selectedCom) {
            comision_total += parseFloat(selectedCom);
        }
    });
    // 赋值到总佣金输入框，可按需调整保留小数位数
    comision.val(comision_total.toFixed(2));
});

补充提示 #

你现有HTML中所有下拉框的name属性都是wifi，表单提交时后端只会收到最后一个下拉框的选中值，建议修改为数组形式name="wifi[]"，方便后端接收所有选中的wifi值。

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