如何將 jQuery 函數應用於具有相同 ID 的所有元素？

Question

我是 jQuery 的新手。 我有以下代碼：

jQuery(document).ready(function() {
    jQuery('#carousel').jcarousel();
});

它僅適用於id="carousel"的第一個ul ，不適用於其他 ul。 如何將其應用於具有相同 ID 的所有元素？

HTML：

<!-- jQuery applies to this div -->
<div id="slideshow-carousel">
    <ul id="carousel" class="jcarousel jcarousel-skin-tango">
        <!-- ... -->
    </ul>
</div>

<!-- jQuery does not apply for this div -->
<div id="slideshow-carousel">
    <ul id="carousel" class="jcarousel jcarousel-skin-tango">
        <!-- ... -->
    </ul>
</div>

Answer 1

您不能擁有多個具有相同 ID 的元素，這就是為什么不起作用。 您應該改用class="caroussel" 。

jQuery(document).ready(function() {
    jQuery('.carousel').jcarousel();
});

Answer 2

元素的 ID 在DOM中應該是唯一的。 兩個或多個元素的 ID 相同是無效的 html 。 要跨元素共享功能，請為它們分配一個公共類，而不是給它們相同的 ID。 如果您不能為它們分配一個公共類，下面的解決方法將允許您選擇具有相同 id 屬性的元素：

使用相同的 ID （如果無法更改 ID）

jQuery(document).ready(function() {
    jQuery('[id=carousel]').jcarousel();
});

使用通用類（推薦方式）

jQuery(document).ready(function() { 
    jQuery('.carousel').jcarousel();
});

Answer 3

在最新版本的 jQuery 中，當頁面上有多個 id 時，選擇器將僅返回在 DOM 中找到的第一個“id”。 您應該改用類。

Answer 4

在這種情況下，您應該使用類。 你不能使用id。 否則你可以試試下面的代碼。

jQuery('ul').jcarousel();