0

私はJクエリを学び、自分自身を教えるのに役立つ小さなプロジェクトを構築しています。

私のコードは、すべてがうまく機能していても、単純なタスクのように見えることを実行するのに非常に長いようです。私は次のような多くの機能を繰り返しているようです：

$("#england").click(function () {

    $('#englandTxt').hide();
    $('#northernIrelandTxt').hide();
    $('#walesTxt').hide();
    $('#scotlandTxt').hide();
    $('#irelandTxt').hide();
    $('#onLoad').hide();
    $("#englandTxt").fadeIn("slow");
     });

http://jsfiddle.net/fy4NP/

これを効果的に整理するにはどうすればよいですか？

thxs！

4

3 に答える 3

5

コードは、すべてを個別にアクセスするのではなく、クラスを使用して要素のグループを識別することでメリットが得られます。巧妙な回避策がありますが、1回の操作で同様のアイテムをターゲットにするためにクラスを使用することをお勧めします。

$('.link').click(function(){
    $('.txt').hide();
    $('#' + $(this).attr('id') + 'Txt').fadeIn();
});​

デモ

于 2012-12-04T10:50:13.003 に答える
4

それらすべてに、などのクラスを追加してcountry、コードを次のように変更できるようにします。

$("#england").click(function () {
    $('.country:not(#englandTxt)').hide();
    $("#englandTxt").fadeIn("slow");
});

:not()セレクターは、イングランドが2回クリックされた場合に、2回クリックされないようにするために使用されますfadeIn。

于 2012-12-04T10:47:05.690 に答える
3

一般的なセレクターを使用します。

//hide all divs
$('div').hide();

それらすべてにのようなクラスを与えることが望ましいでしょcountryう。その場合、以下を使用します。

//hide all divs
$('.country').hide();
于 2012-12-04T10:46:14.737 に答える