在 Ajax 调用后在 jQuery 中保留"height"声明(下拉选择加载产品数据,重置其他页面元素的高度)



我有一些jQuery在产品描述上设置了高度,这可以在这里看到:

https://www.gabbyandlaird.com/product/truition-products/truition-healthy-weight-loss-pack

我用来实现这一点的代码是:

$(document).ready(function() {
var $dscr = $('.commerce-product-field-field-long-description'),
    $switch = $('#toggle'),
    $initHeight = 70; // Initial height
$dscr.each(function() {
    $.data(this, "realHeight", $(this).height());    // Create new property realHeight
    }).css({ overflow: "hidden", height: $initHeight + 'px' });
$switch.toggle(function() {
      $dscr.animate({ height: $dscr.data("realHeight") }, 200);
      $switch.html("- Read More").toggleClass('toggled');
    }, function() {
        $dscr.animate({ height: $initHeight}, 200);
        $switch.html("+ Read More").toggleClass();
    });
});

我决不是一个Javascript专家(甚至不是一个业余爱好者)。我对jQuery的了解相当有限,所以我不确定上面需要更改什么,这样当下拉选择重新加载页面上的数据时,我就不会丢失产品描述中"阅读更多"部分的高度值。我们非常感谢任何协助。谢谢

根据上面的代码,当文档准备好时,您似乎正在做所有事情。这是你能做的。

var initialHeight = function(){
    // you height initialization code here
}
$(function () {
    $(document).ready(initialHeight); // initializes the height on document ready         
    $("#yourSelectBox").change(initialHeight); // initializes the height on combobox selection change
});

希望这能有所帮助。

相关内容

最新更新