jquery 不适用于多个但相同 class

Question

我的移动菜单有这个 jquery，可以在点击时更改 class

jQuery("#slide-out-open").click(function() {
    if( jQuery( this ).hasClass( "slide-out-open" ) ) {
        jQuery('#wrapper').css({overflow:"hidden"});
        jQuery("body").addClass( 'js-nav' );
        jQuery( this ).removeClass('slide-out-open').addClass('slide-out-close');
        return false;
    }
    else if( jQuery( this ).hasClass( "slide-out-close" ) ) {
        jQuery('#wrapper').css({overflow:"auto"});
        jQuery("body").removeClass( 'js-nav' );
        jQuery( this ).removeClass('slide-out-close').addClass('slide-out-open');
        return false;
    }
});

现在我想在左侧弹出菜单中添加相同的按钮。我为菜单添加了相同的 php，html 没问题，但是当我单击第一个按钮并更改其 class 时，我的新按钮没有更改 [=23] =].

所以 jquery 只工作一次，在第一个 class 它找到。我怎样才能更改它以同时更改 classes？

谢谢

Answer 1

jQuery("#slide-out-open") 这绑定到一个 id html 属性，根据规范，您只能将一个元素绑定到一个特定的 id。

我建议将其更改为可以多次选择的 class。

旁注：不推荐使用 .click，并且只会绑定到加载 js 时页面上存在的元素。

我建议使用 .on( 'click', function() {}) 这将允许动态绑定，并且是当前支持的方法。

Answer 2

不太清楚你的意思。但首先，两个按钮不应该有相同的 ID，因为 ID 应该是特定的标识符。也许这甚至是这里的问题。（应该是评论，但我不能评论..）

jquery 不适用于多个但相同 class

jquery not working for multiple but same class

html

javascript

php

jquery

jquery-mobile