同じ高さには、.jsファイルは、私は基本的に以下のように書いた機能を持っている

Question

ファイルに動作していませんここに。私の問題は、このコードは私の.jsファイルで作業していないされているが、私はコピーして貼り付ける場合、それはあなたが

Please click to my real demo

表示されますしようとすると私のコードは非常に取り組んでいるコンソールとgetListHeight();をコピーして、コンソールあなたに貼り付けなぜ私のコードが.jsファイルで正しく動作していないのですか？私のコードを動かすためには何が必要ですか？

と私のgetListHeight（）関数は$(window).resizeで動作します。ウィンドウのサイズを変更したり、クリックイベントが発生しても、関数がdocument.readyで機能していません。

Answer 1

画像がまだ読み込まれていないため、画像タグはそこにありますが、まだ画像が読み込まれているためにサイズが設定されていないため動作しません。

私を次のようにコードを変更したい：

function matchSize() { 
    var getTurHeight = $(this).parents(".tur-list").find(".col-lg-7").outerHeight(); 
    var getLeftHeight = $(this).parents("tur-list").find(".col-lg-5 figure img").outerHeight(); 
    if (getTurHeight > getLeftHeight) { 
    $(this).outerHeight(getTurHeight); 
    } 
} 
function onResize() { 
    $(".tur-list .col-lg-5 figure img").each(matchSize); 
} 
function getListHeight() { 
    $(".tur-list .col-lg-5 figure img").load(matchSize); 
} 

$(document).ready(function(){ 
    getListHeight(); 
    $(document).on('resize', onResize) 
    onResize() 
}); 

これは（おそらくキャッシュされた画像）でのJavaScriptのキックの前にリサイズに、新しくロードされた画像上、および以前にロードされた画像上で動作します。 https://codepen.io/Bamieh/pen/gRLPqm

P.S.：ここ

はcodepenフォークへのリンクです私はあなたがスタイルを変更するとすぐにコードが破損するので、セレクタとしてcol-*クラスに頼らないことをお勧めします。data-*属性を使用して、私の意見になる方法です。