0

いくつかの基本的な jQuery に小さな/(奇妙な?) 問題があります。HTML フォーム内には、次の 2 つの要素があります。

<label for="service-webdesign">
     <input type="checkbox" name="service-web" id="service-webdesign" value="Webdesign" />
     <span id="service-webdesign-span">Webdesign</span>
</label>
<label for="service-SEO" title="Search Engine Optimization">
     <input type="checkbox" name="service-web" id="service-SEO" value="SEO" />
     <span class="service-SEO-span">SEO</span>
</label>

今、私がやりたいのは、「アクティブ」と呼ばれるクラスを追加/削除して、これらの要素のいずれかがヒットしたときに異なるスタイルにすることです。これを実現するためのjQueryは次のとおりです。

$('#service-webdesign').click(function(){
    if($('#service-webdesign-span').hasClass('active')){
        $('#service-webdesign-span').removeClass('active')
        } else ($('#service-webdesign-span').addClass('active'))
    });

$('#service-SEO').click(function(){
    if($('#service-SEO-span').hasClass('active')){
        $('#service-SEO-span').removeClass('active')
        } else ($('#service-SEO-span').addClass('active'))
    });

どちらも同じですが (賢明に機能します)、最初のものだけが期待どおりに機能しています。jQueryを交換しても違いはないので、それはそれらの順序とは何の関係もないと確信しています。私は昨日 jQuery を使い始めたばかりなので、おそらくこの動作を理解する能力が不足しています。

どんな助けでも大歓迎です!

4

2 に答える 2

1

service-SEO-span はクラスですが、service-webdesign-span は ID であり、ID であるかのように両方をターゲットにしています。

于 2013-03-07T08:43:05.103 に答える
1

toggleClassを使用する必要があります

そして、Juhana がコメントで既に述べたように、適切なセレクターを使用する必要があります。

$('#service-webdesign-span').toggleClass('active');
于 2013-03-07T08:43:25.837 に答える