Jquery 刷新页面之前不显示/删除动态内容

我已经看了那个问题，因为它已经超过10年了。技术变革与创新 那篇帖子上的答案解决不了我的问题

我看过一些这样的帖子，但没有一个对我有用

而这些只是少数

我将数据附加到模式中的div中，问题是当我打开模式时，动态内容不会显示。当我删除项目时，它仍然会显示，直到我刷新页面

作为上述帖子之一，添加文档不起作用

我已经添加了所有脚本，以防问题出现在其中一个脚本中

<script>
    $(document).ready(function () {
        function removeItem(id) {
            var obj1 = JSON.parse(sessionStorage.getItem("cart")) || {};
            var items = obj1;
            for (var i = 0; i < items.length; i++) {
                if (items[i].id === id) {
                    alert(id);
                    items.splice(i, 1);
                    break;
                }
            }
            sessionStorage.setItem("cart", JSON.stringify(obj1));
        }

        $('.itemsInCart').on('click', 'p.remove-item', function (e) {
            e.preventDefault();
            var val = $(".remove-item").attr('data-id');
            removeItem(val);
        });
    });
</script>
<script>
    $(document).ready(function () {
        $("#displayTotal").hide();
        $('.btnProduct').on('click', function (e) {
            e.preventDefault();

            var id = $(this).data("id");
            var title = $(this).data("title");
            var rawPrice = $(this).data("price");
            var cart = sessionStorage.getItem("cart");
            var obj = [];
            if (cart) {
                obj = JSON.parse(cart);
            }
            obj.push({ "id": id, "title": title, "price": rawPrice });
            sessionStorage.setItem("cart", JSON.stringify(obj));

            $("#displayTotal").show();
        });
        function populateContainer() {
            var retrieveCartFromSessionStorage = sessionStorage.getItem("cart");
            var displayCartInSessionStorage = JSON.parse(retrieveCartFromSessionStorage);

            var total = 0;
            var formatter = new Intl.NumberFormat('en-GB', {
                style: 'currency',
                currency: 'GBP',
                minimumFractionDigits: 2
            });

            for (var p in displayCartInSessionStorage) {
                if (displayCartInSessionStorage.hasOwnProperty(p)) {
                    $(".itemsInCart").append('<p class="remove-item" data-id="' + displayCartInSessionStorage[p].id + '">' + displayCartInSessionStorage[p].title + ' ' + formatter.format(displayCartInSessionStorage[p].price) + " " + '<span class="text-danger">Remove Item</span></p>');
                    total += displayCartInSessionStorage[p].price;
                }
            }

            var basicPrice = $("#aircraft-basic-price").attr('data-basic');
            var sum = parseFloat(basicPrice) + parseFloat(total);

            $("#displayTotal").text(formatter.format(sum));
        }

        populateContainer();
    });
</script>

$（文档）.ready（函数（）{
函数removeItem（id）{
var obj1=JSON.parse（sessionStorage.getItem（“cart”））|{}；
var项目=obj1；
对于（变量i=0；i”+displayCartInSessionStorage[p].title+++formatter.format（displayCartInSessionStorage[p].price）+“+”remove item
”；
总计+=displayCartInSessionStorage[p]。价格；
}
}
var basicPrice=$（“#飞机基本价格”）.attr（'data-basic'）；
var sum=parseFloat（基本价格）+parseFloat（总计）；
$（“#displayTotal”）.text（formatter.format（sum））；
}
populateContainer（）；
});

模式是：

<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <h4>Products</h4><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                    aria-hidden="true">×</span></button>
        </div>
        <div class="modal-body">
            <p class="text-center text-muted">Items in Cart</p>
            <div class="itemsInCart">
            </div>
        </div>
        <div class="modal-footer"><button class="btn btn-light" type="button" data-dismiss="modal">Close</button><button
                class="btn btn-dark" type="button">Checkout</button></div>
    </div>
</div>

产品×
购物车中的物品

结帐

我认为问题在于您没有运行

populateContainer（），然后再打开模式对话框。放置
populateContainer（）在
$（“#displayTotal”）.show（）之前这将解决您的问题。
请尝试添加一个可运行的代码段，以再现该问题。您可以使用
图标执行此操作。已尝试但无法使其工作，请继续获取脚本错误，即使它在我的机器上工作可能重复的