jquery .css（）只設置找到的第一個匹配樣式值

-1

我正在嘗試使用jQuery的.css（）來設置基於窗口高度的一些按鈕的「最小高度」。

無論出於何種原因，它只設置與FIRST按鈕匹配的最小高度，但有16個匹配的按鈕。

http://jsfiddle.net/VDtgT/20/embedded/result/

「＃製表BTN-2」是問題。 Thiss是我使用的JavaScript：

<script> 
$(document).ready(function(){ 
    setMaxHeight(); 
    $(window).bind("resize", setMaxHeight); 

    function setMaxHeight() { 
    $("#tab-content-1").css("max-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-content-1").css("min-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-content-2").css("max-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-content-2").css("min-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-content-3").css("max-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-content-3").css("min-height", ($(window).height() * 0.67 | 0) + "px"); 
    $("#tab-btn-2").css("min-height", ($(window).height() * 0.67 | 0) + "px"); 

    } 

}); 
</script>

來源

2013-04-02 JG707

ID必須是唯一的。 http://jsfiddle.net/VDtgT/21/該警報顯示您有多個具有相同ID的元素。 –

爲什麼不通過使用類來設置CSS？如果所有的div（我想你使用的div）將會是相同的高度，例如：而不是$（「＃tab-content-n」）有$（「.tab-content」）這會使它變短，當然你可以留下ID以便以後單獨引用它們。 –

@SamuelLopez tab-content-n與tab-btn-n有點不同。前兩個內容容器是相同的，但最後一個將具有獨特的屬性。我可以結合前兩個。謝謝！ – JG707

ID是唯一的，和jQuery只將具有特定ID找到的第一個元素，因爲應該只有一個。

您需要改爲使用類。

$(".tab-btn-2").css(....

來源

2013-04-02 17:35:46 adeneo

謝謝！我感覺非常愚蠢，但是謝謝:) – JG707

@ JG707 - 沒有理由感到愚蠢，每天都會出現十次，所以這是一個常見問題。 – adeneo

一個選項是給每個按鈕相同的類名稱，並使用類來設置最小高度（與id）。您的ID對頁面上的每個元素都應該是唯一的。

<input type=button id=whatever class="tab-btn-2" /> 
... 
$(".tab-btn-2").css("min-height", ($(window).height() * 0.67 | 0) + "px");

來源

2013-04-02 17:36:19 sgeddes

jquery .css（）只設置找到的第一個匹配樣式值

回答

相關問題