変更親（DIV）ウィンドウの後にその子の大きさ（P）までの高さは、私は窓のサイズを変更した後、その子の高さに一致するように、親のdivのサイズを変更しようとしています

Question

$(window).on("resize", function() { 

    var totalHeight = 0 

    var $p = $("#cwt-help").children(); 

    $p.each(function() { 
     totalHeight += $("#cwt-help").outerHeight(); 
    }); 

    $("#cwt-help").css({ "height": totalHeight }) 
}); 

のサイズを変更します。私が持っている問題は、このコードで、サイズ変更前の高さを取得することです。どのようにして結果の高さを得ることができますか？ありがとう！

Answer 1

resizeイベントが発生したときにコードが実行されます。
イベントの後に実行されます。

だから約setTimeout()は？

私はイベントが十分である後100ミリ秒と思います。

$(window).on("resize", function() { 

    setTimeout(function(){ 
    var totalHeight = 0 

    var $p = $("#cwt-help").children(); 

    $p.each(function() { 
     totalHeight += $("#cwt-help").outerHeight(); 
    }); 

    $("#cwt-help").css({ "height": totalHeight }); 
    },100); 
}); 

Answer 2

これは動作しやすくなります。ウィンドウのサイズを変更するとき、高さを要素のscrollHeightに設定します。

$(window).on("resize", function() { 
 
    $("#cwt-help").css({ "height": $('#cwt-help').srollHeight }); 
 
});

#cwt-help{ 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="cwt-help"> 
 
    <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate.</p> 
 
    
 
    <p>Velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> 
 
</div>