クリックしたときにJqueryのクリック機能が動作しない

Question

jqueryのクリック機能を起動する問題に直面しています。 jqueryを使って電話番号と電子メールを隠したい。電話番号とメールアドレスは、<p>タグをクリックした場合のみ表示されます。

以下は私がすでに書いている私のjquery関数です。

function() { 
    var $phone = '123456123', 
     $email = 'info@youremail.com', 
     phone = $('#phone'), 
     email = $('#email'); 

    $(phone).click(function() { 
     var text = $(this).text() == $phone ? 
      'Click to view number' : $phone; 
     $(this).text(text).toggleClass("active"); 
    }); 

    $(email).click(function() { 
     var text = $(this).text() == $email ? 
      'Click to view email' : $email; 
     $(this).text(text).toggleClass("active"); 
    }); 

}();  

コードを実行すると、数字タグをクリックしても何も変わりません。

Answer 1

だけでjsの上に小さな修正を必要としていました。 これを見てくださいhere

$(function() { 
    var $phone = '123456123', 
      $email = 'info@youremail.com', 
      phone = $('#phone'), 
       email = $('#email'); 

    $(phone).click(function() { 
     var text = $(this).text() == $phone ? 
      'Click to view number' : $phone; 
     $(this).text(text).toggleClass("active"); 
    }); 

    $(email).click(function() { 
     var text = $(this).text() == $email ? 
      'Click to view email' : $email; 
     $(this).text(text).toggleClass("active"); 
    }); 
});  

Answer 2

あなたのコードは次のようである：

function() { 
    // code 
}(); 

IIFEsはそのように動作しません。関数を（）にラップします。

(function() { 
    // code 
})(); 

そして、それは機能します。

other waysもあります。機能を「アクティブにする」ためです。最高のスタイルは議論の余地があります。私がお勧めするのは、1つを選んで一貫して使用することです。

See jsbin demo here.