重複功能

我正在學習J查詢並構建一個小型項目來幫助自學。重複功能

我的代碼似乎很長，看起來像是簡單的任務，即使你一切正常。我似乎重複的類似功能很多：

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

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

http://jsfiddle.net/fy4NP/

如何將我有效整理這個嗎？

thxs！

來源

2012-12-04 Ma9ic

您的代碼將受益於使用類來標識元素的組，而不是單獨訪問它們。雖然有巧妙的解決方法，但我建議使用類在單個操作中定位類似的項目。

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

Demo

來源

2012-12-04 10:50:13

使用常見的選擇：

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

因此最好給他們像country所有的一類，在這種情況下，你可以使用：

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

來源

2012-12-04 10:46:14

添加類他們都是，比如country，所以你可以把你的代碼改成：

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

:not()選擇器用於如果英格蘭點擊兩次，它不會fadeIn兩次。

來源

2012-12-04 10:47:05 Curt

你不一定需要'：沒有（#englandTxt）'，因爲它在被無論如何褪色。 –

@Asad它的整潔這種方式。如果你兩次點擊英格蘭，它會隱藏它並再次褪色。如果您點擊英格蘭已經打開的英格蘭代碼，我的代碼就不會隱藏並再次顯示。 – Curt

爲什麼downvote？ – Curt

回答

相關問題