在“价格”更改后，如何将此附加的DIV保留在原位？

Question

我正在根据我的旧工作开发的定制CMS设计此网站：

http://dev544.webdugout.com/View/Snow-Removal

为了将price div“ productPrice”移到页面底部，我使用了以下命令：

$(".productPrice").appendTo(".productPriceContainer");

我还使用以下内容在数字价格前面添加了文本：

$( ".productPrice" ).prepend( '<h2><span>4</span> Your Total Cost Will Be</h2>');

一切看起来都很不错，尽管一旦您选择了一个可以改变价格的选项，div就会回到代码中的原始位置，并且还会删除我添加的文本。 有什么办法可以用jQuery解决此问题，而不必与程序员联系？

谢谢！

Answer 1

元素移到顶部的原因是因为这是它们在首次加载页面时在DOM中的原始位置。 当您从下拉列表中选择一项时，页面将执行回发，并且不会再次调用您的JavaScript。 尝试使用下面的代码。 这应该导致您的JavaScript在每次执行回发时都被调用。

        function pageLoad() {
            BindjQueryEvents();
            $(".productPrice").prepend('<h2><span>4</span> Your Total Cost Will Be</h2>');
        }
        //Re-bind for callbacks
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_endRequest(function () {
            BindjQueryEvents();
        });
        function BindjQueryEvents() {

            $(".productPrice").appendTo(".productPriceContainer");
        }