如何在jQuery的.each()中添加一组不同值？现有代码未达预期求助

看起来你遇到的核心问题是在.each()循环里处理多个元素的data值时，没有正确收集或设置这些值，导致最终结果不符合预期。我来帮你梳理下问题并给出解决方案：

先分析你的代码场景 #

你的HTML结构里，每个.removeJiku按钮后面跟着一个带data-thisPostId属性的.removeId span，目标应该是把这些不同的ID值收集起来，放到#usp-form-253 #usp-custom-3这个表单元素里对吧？

常见错误原因 #

如果你的原代码是在.each()循环里直接给目标元素赋值，那每次循环都会覆盖之前的值，最后只会保留最后一个ID——这大概率就是你没实现预期的原因。

修正方案1：页面加载时收集所有ID #

如果是页面加载时就需要把所有data-thisPostId的值都收集起来，用逗号分隔存入表单字段，可以这么写：

<!-- 你的HTML结构 -->
<button type="button" class="removeJiku btn btn-danger">Remove</button> 
<span class="removeId" data-thisPostId="248"></span> 
<button type="button" class="removeJiku btn btn-danger">Remove</button> 
<span class="removeId" data-thisPostId="242"></span>

// 初始化数组来存储所有ID
const removeIds = [];

$(".removeJiku").each(function() {
    // 用jQuery的data()方法获取data属性，比attr()更可靠（自动处理类型）
    const removeThisId = $(this).next(".removeId").data("thisPostId");
    // 确保ID有效再加入数组
    if (removeThisId) {
        removeIds.push(removeThisId);
    }
});

// 把数组转成逗号分隔的字符串，设置到目标表单元素
$("#usp-form-253 #usp-custom-3").val(removeIds.join(','));

修正方案2：点击按钮时添加对应ID #

如果你的需求是点击某个Remove按钮时，把它对应的ID添加到表单字段（而不是一次性收集所有），那应该给按钮绑定点击事件，而不是直接用.each()遍历：

$(".removeJiku").on("click", function() {
    const removeThisId = $(this).next(".removeId").data("thisPostId");
    if (!removeThisId) return; // 无有效ID则终止

    // 获取表单字段当前值，追加新ID（避免覆盖）
    const currentValue = $("#usp-form-253 #usp-custom-3").val();
    const newValue = currentValue ? `${currentValue},${removeThisId}` : removeThisId;
    
    $("#usp-form-253 #usp-custom-3").val(newValue);
});

关键要点 #

• 用data()代替attr()获取data属性：jQuery的data()会自动解析属性值的类型（比如把字符串"248"转成数字248），而且能缓存数据，性能更好。
• 避免循环内直接赋值：如果要收集多个值，先存到数组或变量里，循环结束后统一设置，防止被覆盖。
• 做有效性校验：确保获取到的ID不是空值，避免无效数据混入。

内容的提问来源于stack exchange，提问作者rob.m