jQuery判断HTML表格是否含指定值问题：PHP生成行未被识别

我来帮你搞定这个重复添加的bug！你的问题根源在于原来的:contains()检测逻辑不够精准，没法正确识别PHP预加载的表格项，再加上代码里还有个小的HTML语法错误，一起来修复：

问题分析 #

1. :contains()的局限性：这个选择器是模糊匹配，还会匹配子串，同时PHP输出的商品名称可能带有换行、空格，和你从菜单获取的itemName格式不一致，导致检测不到已存在的预加载项。
2. HTML语法错误：你的content变量末尾没闭合</td></tr>，会导致DOM结构异常，影响后续检测。

修正后的完整代码 #

function add_to_table(selector) {
    // 用text()获取纯文本，同时去除前后空白，避免格式差异
    var itemName = $(selector).closest(".item").find(".item-name").text().trim();
    var itemCost = $(selector).closest(".item").find(".item-price").text().trim();
    
    // 修复HTML标签闭合问题，用模板字符串更清晰
    var content = `<tr> <td>${itemName}</td> <td>${itemCost}</td></tr>`;
    var table = $("#orderTable");
    
    // 初始化存在标记
    var itemExists = false;
    
    // 遍历所有数据行（跳过表头的第一行）
    table.find("tr:not(:first)").each(function() {
        var existingName = $(this).find("td:first").text().trim();
        // 精确匹配商品名称
        if (existingName === itemName) {
            itemExists = true;
            return false; // 找到匹配项，立即跳出循环
        }
    });
    
    if (!itemExists) {
        table.append(content);
    } else {
        // 可选：提示用户商品已存在
        alert("这个商品已经在订单里啦！");
    }
}

关键改进点 #

• 精确匹配：遍历表格每一行的商品名称，用===做精确对比，同时trim()去除前后空白，解决PHP输出和菜单文本的格式差异问题。
• 使用text()替代html()：确保获取的是纯文本内容，避免菜单里的HTML标签干扰匹配（比如如果item-name里有<span>之类的标签，html()会把标签也算进去，导致匹配失败）。
• 修复HTML结构：闭合了表格行的标签，保证DOM结构正确。
• 跳过表头行：用tr:not(:first)只检查数据行，避免和表头的<th>混淆。

这样修改后，不管是PHP预加载的项还是用户后来添加的项，都能准确检测到重复，不会再出现重复添加的问题啦！

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