使用jQuery实现SKU重复验证遇遍历问题，寻求解决方案

问题根源 #

你当前的代码仅对比了第一个.sku-validator-dvd元素的文本，且$('.sku-validator-dvd').text()会把所有匹配元素的文本拼接成一个字符串，导致无法正确校验后续SKU是否重复。

修复方案 #

推荐先将所有已存在的SKU收集到数组中，再检查输入值是否在数组内，逻辑更清晰高效：

修改后的jQuery代码

$('#save_product').click(function(e){
    // 阻止按钮默认提交行为（若为表单提交按钮）
    e.preventDefault();
    
    var skuInput = $.trim($('#sku').val());
    // 收集所有已存在的SKU到数组
    var existingSkus = $('.sku-validator-dvd').map(function() {
        return $.trim($(this).text());
    }).get();
    
    // 校验输入SKU是否重复
    if (existingSkus.includes(skuInput)) {
        alert('This sku already exists');
        return; // 终止后续操作
    }
    
    // 校验通过后可执行表单提交或其他逻辑
    // $(this).closest('form').submit();
});

备选遍历校验方式（适合无需复用SKU数组的场景） #

若倾向逐个遍历对比，可使用以下写法：

$('#save_product').click(function(e){
    e.preventDefault();
    var skuInput = $.trim($('#sku').val());
    var isDuplicate = false;
    
    $('.sku-validator-dvd').each(function() {
        var existingSku = $.trim($(this).text());
        if (existingSku === skuInput) {
            isDuplicate = true;
            return false; // 终止遍历循环
        }
    });
    
    if (isDuplicate) {
        alert('This sku already exists');
    } else {
        // 校验通过后的业务逻辑
    }
});

额外优化建议 #

• 可将隐藏的SKU展示元素替换为<input type="hidden" class="sku-validator-dvd" value="<?= $dvdList->sku ?>">，用$(this).val()获取值更精准，避免文本拼接问题。
• 前端校验仅为辅助，建议后端同步做重复校验，防止绕过前端的非法提交。

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