2

私は Javascript で OOP を初めて使用します。以前のコードの一部を変更して、再利用可能なコードを作成しました。インライン コードの代わりに、それらを Javascript クラスに変換することにしました。

だからここに私のクラスがあります：

    function TreeStructure(psi, csi, csc, kwargs) {
        this.parentSelectorId       = psi;
        this.childrenSelectorId     = csi;
        this.childrenSelectorClass  = csc;
    
        kwargs = (typeof kwargs === "undefined") ? 'NoOptionalArguments' : kwargs;
    
        // First Question

        $('#' + this.parentSelectorId).click(this.parentSelectHandler());

        // Second Question 
        $('#' + this.parentSelectorId).on('click', this.parentSelectHandler(e));        
    }; 

    TreeStructure.prototype.parentSelectHandler = function () {
        alert("Why is it called after page loads ?!?
                       it's attached to a click handler   huh?");    
    }

クラスの使用法：

    $(document).ready(function(){
         tree = new TreeStructure('blahId', 'blahId', 'blahClass');
    });

しかし、これを実行すると、（私にとって）予期しないイベントが発生します。だからここに私の2つの質問があります：

  1. parentSelectHandlerページの読み込み後に関数が呼び出されるのはなぜですか? （期待される動作は、セレクターがクリックされた後に呼び出されると思います）
  2. jQuery イベント ハンドラーでは、イベントを取得してイベント ハンドラー関数に渡すことができますがparentSelectHandler、引数を渡そうとする'e'と、定義されていないと表示されます。

誰でも私を助けてくれますか？

4

2 に答える 2