Question

对不起我的英文（

不可能做出几个功能。

当您点击“.jv-add”时，添加“.cat-hover”并删除“.item”+添加html - 按钮，按此按钮返回所有内容。像所有没有Poble的作品一样。
我认为函数返回到它的前状态。也就是说，点击“.cat-close”（添加的html）需要删除“.car-hover”和html（）以及添加“.item” 切换尝试，但失败了（
我有大约13个元素，类“jv-add”怎么做才能完成，这个条目的当前函数，所有其他重置为零

我将非常感谢你的帮助！

HTML code：

<div class="cat-item">
            <div id="cat" class="jv-add item">
                <h3 class="cat-one head">Name category</h3>
                <div class="clear"></div>
                <ul class="onelevel">
                    <li><a href="file.html">Sub category 1</a></li>
                    <li><a href="file.html">Sub category 2</a></li>
                    <li><a href="file.html">Sub category 3</a></li>
                    <li><a href="file.html">Sub category 4</a></li>
                    <li><a href="file.html">Sub category 5</a></li>
                </ul>
            </div>
        </div>

Javascript代码：

$(".cat-item>.jv-add").click(function () {
    $(this).addClass("cat-hover").removeClass("item").append('<i class="fa cat-close fa-times"></i>');
});

Answer 1

您可以将所有事件的处理委托给容器元素cat-item

$(".cat-item")
    .on('click', '.jv-add:not(.cat-hover)', function () {
    $(this)
        .addClass("cat-hover")
        .removeClass("item")
        .append('<i class="fa cat-close fa-times"></i>');
}).on('click', '.cat-close', function (e) {
    $(this)
        .closest('.jv-add')
        .removeClass('cat-hover')
        .addClass('item')
        .find('.cat-close')
        .remove();
    return false;
});

演示 http://jsfiddle.net/rUKde/

Jquery添加，删除Jquery中的类

1 个答案: