首页 > jquery怎么写这个效果?点一下是+,再点一下变成-

jquery怎么写这个效果?点一下是+,再点一下变成-

开始是“+”号,点一下下面出来内容变成"-"号,再点就又变成“+”了。

下面内容显示我用的是slideToggle();这个函数;

$("#youhui1").click(function(){
                $(this).children().html("-");
                $(".new_cart_sale3").slideToggle("slow");
            })

$("#youhui1").click(function(){
    var html =  $(this).children().html() == '+' ? '-' : '+';
    $(this).children().html(html);
    $(".new_cart_sale3").slideToggle("slow");
})

做一下判断,如果是‘+’那么就换成‘-’,如果是‘-’就换成‘+’;


咱们这么来下试试,首先写两个class:

.plus:after{
    content: "+";
}

.sub:after{
    content: "-";
}

然后给你的元素上加一个默认的class,取决于你说想默认+还是-:

<span class="plus"></span>

我这里假设你的元素是span,然后默认显示+

最后改js:

$("#youhui1").click(function(){
    $(this).toggleClass('plus').toggleClass('sub');
    $(".new_cart_sale3").slideToggle("slow");
})

先做图标
可以参考font awesome
然后在事件中添加/删除相应的class就可以了

【热门文章】
【热门文章】