jQuery onClick移除元素失效求助：PHP生成代码无法删除目标元素

我帮你排查出问题所在了，主要是PHP生成的HTML存在语法错误，导致jQuery找不到目标元素，具体分析和修复方案如下：

1. 核心问题：Input标签的属性语法错误 #

看你PHP代码里生成的input标签：

<input type='hidden' name='<?= $name ?> id='<?= $name ?>'' value='<?= $lineItem->id ?>,<?= $lineItem->supplierId ?>,<?= $lineItem->supplierName ?> ,<?= $lineItem->modelId ?>,<?= $lineItem->modelName ?>,<?= $lineItem->price ?> ,<?= $lineItem->quantity ?>'/><?= $txtValue ?>

这里的name属性没有闭合单引号，直接拼接了id属性的代码，导致最终渲染出的HTML中，id属性是无效的（浏览器会解析成混乱的属性结构）。jQuery的$("#" + idToRemove)自然找不到对应的元素，所以执行remove()没有效果。

2. 修复PHP代码 #

把input标签的代码修正为：

<input type='hidden' name='<?= $name ?>' id='<?= $name ?>' value='<?= $lineItem->id ?>,<?= $lineItem->supplierId ?>,<?= $lineItem->supplierName ?> ,<?= $lineItem->modelId ?>,<?= $lineItem->modelName ?>,<?= $lineItem->price ?> ,<?= $lineItem->quantity ?>'/>

关键是给name='<?= $name ?>'补上闭合的单引号，确保id属性能被浏览器正确识别。

3. 优化移除逻辑（可选） #

当前你的onBtnRemove函数只移除了隐藏的input元素，但从界面来看，你大概率是想移除包含文本和Remove按钮的整个表格行。如果是这样，可以修改函数为：

function onBtnRemove(idToRemove) {
    const toRemove = $("#" + idToRemove);
    toRemove.closest("tr").remove(); // 找到input所在的表格行并移除
}

4. 额外验证步骤 #

• 打开浏览器控制台（按F12），执行$("#生成的具体id值")，检查是否能找到目标元素，确认id渲染正确。
• 确保页面已经正确引入了jQuery库，否则$函数会报错，导致逻辑无法执行。

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