ready（）メソッドを置き換えるときにjQuery on（）メソッドが機能しない？

Question

ready（）メソッドを置き換えるために関数の中でon（）メソッドを使用しようとしていますので、複数のイベントを使って関数をトリガすることができます。だから、単純な用語で、私は交換してくださいしようとしています

function tableImgScale() { 
$(function() { 
    var bandTableHeight = $('#banddetails').height() + "px"; 

    $(document).ready(function() { 
     $('#banddetails td:nth-child(1)').css({"height": bandTableHeight, "overflow": "hidden"}); 
     $('#banddetails td img').css({"display": "block", "width": "100%", "height": "100%", "objectFit": "cover"}); 
    }); 
}); 
} 

：と$(document).ready(function() {...
：ここでは一般的な私はそれを使用したいと思っています機能です$(document).on('ready resize', function() {...

は、しかし、それは動作しません。しかし、.ready（）メソッドのインスタンスを持つ関数は完全に正常に動作します。どんな助けもありがとう。

Answer 1

$(document).readyに電話する必要はありません。あなたのtableImgScale関数の内部

、次のように記述：

$(function() { 
    // stuff 
}); 

...文書は関数を呼び出す前に準備ができているのを待っているもう一つの方法です。したがって、$(document).readyへのあなたの内部コールは不要です。しかし、ドキュメントが準備されているときとサイズ変更が行われたときにCSS調整が行われるようにするには、そのロジックを独自の関数に抽出して、すぐに呼び出すことができ、resizeのリスナーとして設定できます。

function tableImgScale() { 
 
    $(function() { 
 
    function adjustBandDetails() { 
 
     $('#banddetails td:nth-child(1)').css({ 
 
     "height": bandTableHeight, 
 
     "overflow": "hidden" 
 
     }); 
 
     $('#banddetails td img').css({ 
 
     "display": "block", 
 
     "width": "100%", 
 
     "height": "100%", 
 
     "objectFit": "cover" 
 
     }); 
 
    } 
 
    var bandTableHeight = $('#banddetails').height() + "px" 
 
    adjustBandDetails() 
 
    $(document).on('resize', adjustBandDetails) 
 
    }); 
 
}