我尝试删除从 AJAX 调用返回后添加到我的页面的 HTML 元素。 但 jQuery 似乎不知道这种动态添加的元素。有什么解决办法吗?
上下文:
- 我正在构建一个简单的购物车。
- 当用户单击“添加”按钮时,我会在数据库中添加该项目,并且希望将其显示在屏幕上而不重新加载页面。
- 但是,因为用户可能会多次点击同一项目的“添加” 在购物过程中,每次他点击时,我都想删除任何 从购物车 DIV 中取出该商品的行,并只保留最 该商品的最新商品。
现在,它不起作用,所以我的 HTML 在多次添加后看起来像这样:
<div id="CartList">
<p id="Item_shirt7363">shirt7363</p>
<p id="Item_shirt7363">shirt7363</p>
<p id="Item_shirt7363">shirt7363</p>
</div>
我的 jQuery 看起来像这样:
function AddToCartClicked()
{
item_code = $("#ItemCode").val();
qty = $("#Qty").val();
$.ajax
(
{
type: "POST",
url: "/_res/php/add-item.php",
dataType: "text",
data: "puid=123&code=" + item_code + "&qty=" + qty,
success: function(data)
{
// PROBLEM: First, remove any existing line with this ID
$("#Item_" + item_code).remove();
// Write new line
newLine = "<p id='Item_" + item_code + "'>" + item_code + "</p>";
// Add the line in the HTML
$("#CartList").prepend(newLine);
}
}
);
return true;
}
我搜索了论坛,但没有找到与我的问题匹配的内容。另外,我是新手,所以请假设愚蠢。谢谢。
最佳答案
感谢你们所有的帮助,这确实帮助我调试了这个!
最后,问题是某些项目代码中包含句点(“shirt235.b”),并且 jQuery 在检索句点时会出现问题(It's in the FAQ.) )。
我真的很抱歉,为了简单起见,我使用了一个虚构的示例,认为 item_code 是什么并不重要...我已经吸取了教训,并且将仅发布真实世界代码从现在开始!请接受我的歉意并感谢您的理解。
祝你度过愉快的一周!
关于javascript - 如何删除 jQuery 中 AJAX 调用后添加的元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7073514/