2010-08-31 69 views
0

我在各種ID上使用簡單的show-hide腳本。現在的問題是,現在每個人都是獨立的JS,通過jQuery調用文檔就緒函數。合併文檔準備腳本?

有沒有辦法將這個結合成一個更靈活的腳本,或者至少是以某種形式或另一個形式結合到一個腳本中。提前感謝您的時間!

下面是一個例子:

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#loadDummy7").hover(

    function() { 
     $("#dummy7").show(); 
    }, function() { 
     $("#dummy7").hide(); 
    }); 
}); 
</script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $("#loadDummy8").hover(
    function() { 
     $("#dummy8").show(); 
    }, function() { 
     $("#dummy8").hide(); 
    }); 
});  
</script> 
+0

爲什麼這是一個問題?它可以很好地處理多個ready()塊。 – 2010-08-31 22:14:55

+0

或者只是合併成一個ready()塊。 – simnom 2010-08-31 22:16:38

回答

4

你可以把它合併成這樣一個腳本:

$(function(){ 
    $("[id^='loadDummy']").hover(function() { 
    $("#" + this.id.replace('loadD', 'd')).toggle(); 
    }); 
}); 

它使用attribute-starts-with selector讓所有id="loadDummyXXX"控制,並發現與切換元件相應的dummyXXX ID。一個簡單的方法是使用類和比較發現,例如,如果你的標記是這樣的:

<div class="dummyWrapper"> 
    Stuff 
    <div class="dummy" style="display: none;"> More Stuff</div> 
</div> 

你可以像這樣做,更清潔:

$(function(){ 
    $(".dummyWrapper").hover(function() { 
    $(this).find(".dummy").toggle(); 
    }); 
});