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


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

它可以工作，但我需要单击一次才能工作。所以 - 点击（什么都没有发生），点击（sortUP），点击（sortDown）

我想删除第一次点击。

感谢社区的帮助！

4

3 回答 3

5

首先，您错误地使用了 toggleClass。您似乎希望在每次单击时切换 sortDown 和 sortUp。这已经完成了toggleClass("sortDown sortUp")。

其次，当您加载页面时，您需要您的类.sort具有sortUp或sortDown设置其属性。class例如<a href="#" class="sort sortDown">。这确保您可以推理您的代码（即，在sortUp, sortDown您的div.

第三，$(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您可以简单地同时指定它们。只要元素以一个或另一个开始（不是两者都不是），它每次都会交换它们。

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

您可以看到它在JSFiddle上运行。

于 2012-10-18T00:05:05.337 回答
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 回答