0 
<a href="#" class="sort">Sort</a> 


   $(".sort").click(function (event) {
        $(this).toggle(function() {
                $(this).toggleClass("sortUp","sortDown");
            }, function() {
                $(this).toggleClass("sortDown","sortUp");
           });
    });

動作しますが、動作する前に 1 回クリックする必要があります。そう - クリック (何も起こらない)、クリック (sortUP)、クリック (sortDown)

最初のクリックを削除したいと思います。

助けてくれてありがとうコミュニティ！

4

3 に答える 3

5

まず、toggleClassを間違って使用しています。クリックするたびに sortDown と sortUp を切り替えたいようです。で完了toggleClass("sortDown sortUp")です。

第 2 に、ページをロードするときにクラスのプロパティ.sortを保持sortUpまたはsortDown設定する必要があります。class例えば<a href="#" class="sort sortDown">。これにより、コードについて推論できるようになります (つまり、 の1 つだけが に設定されていることは常にtrue です)。sortUp, sortDowndiv

第三に、$(this).click(function() { /* code */ })「誰かがクリックしたらする」という意味/*code*/です。あなたはあなたの

$(this).click(function() { $(this).toggleClass("sortUp sortDown"); })

つまり$(".sort").click(function () {、動作を開始するためだけに「並べ替え」の最初のクリックが必要です。

したがって、正しいバージョンは次のとおりです。

<a href="#" class="sort sortDown">Sort</a> 


   $(document).ready(function () {
        $(".sort").click(function() {
                $(this).toggleClass("sortUp sortDown");
        });
    });
于 2012-10-18T00:05:58.317 に答える
0

sortUp または sortDown クラスから始めたくない場合は、次のようにします。

<a href="#" class="sort">Sort</a> 

$(".sort").click(function (event) {            
    if($(this).hasClass("sortUp") || $(this).hasClass("sortDown")){
        $(this).toggleClass("sortUp sortDown");
    }else{
        $(this).addClass("sortUp");
    }
});
于 2012-10-18T00:10:23.107 に答える
0

最初のクリックでクリックイベントを追加しているように見えます。また、切り替えたい場合は、sortUp両方sortDownを簡単に指定できます。要素がどちらか一方 (両方でもどちらでもなく) で始まる限り、毎回それらが入れ替わります。

$(".sort").click(function() {
    $(this).toggleClass('sortUp sortDown');
});

これはJSFiddleで実行されていることがわかります。

于 2012-10-18T00:05:05.337 に答える