购物车移除商品后，点击Add to Cart按钮无法重新添加问题求助

问题原因 #

点击移除按钮后，你通过document.getElementById('itemshow').style.display = "none"隐藏了整个购物车容器，但再次点击「Add to Cart」按钮时，只设置了移除按钮rtm显示，没有重新显示itemshow容器——导致商品内容已经赋值到itm1里，但父容器处于隐藏状态，用户看不到商品，误以为无法重新添加。

修复代码 #

JavaScript 修正版

// 添加商品到购物车
document.getElementById('btn1').onclick = function() {
  myFunc()
};

function myFunc() {
  const cartContainer = document.getElementById('itemshow');
  const sourceItem = document.getElementById('itm_img');
  
  // 重新显示购物车容器
  cartContainer.style.display = "block";
  // 填充商品内容到购物车
  document.getElementById('itm1').innerHTML = sourceItem.innerHTML;
  // 显示移除按钮
  document.getElementById('rtm').style.display = "block";
}

// 从购物车移除商品
document.getElementById('rtm').onclick = function() {
  rtm()
};

function rtm() {
  document.getElementById('itemshow').style.display = "none";
}

补充完整的购物车HTML结构

你的原HTML代码不完整，这里补充购物车区域的基础结构（需添加到<body>标签内）：

<!-- 购物车容器 -->
<div class="item_container" id="itemshow" style="display: none;">
  <div id="itm1"></div>
  <button id="rtm">移除商品</button>
</div>

关键修改点 #

• 添加商品时，先将隐藏的购物车容器itemshow设置为display: block，确保商品内容能被用户看到；
• 保留移除时隐藏容器的逻辑，但添加流程中必须恢复容器的显示状态。

内容的提问来源于stack exchange，提问作者Pentakota Lalith Prasad