每次删除项目时添加类?

时间:2013-01-11 18:27:15

标签: jquery drag-and-drop

感谢您提前查看此问题。

我正在使用jQuery拖放我正在大学做的项目,我想要计算每一滴并改变每一滴上添加的类。

这是jQuery:

$('#droppableChoking').droppable({
    drop: function (event, ui) {
        //reuse jQuery object
        var $this = $(this);

        //get object type
        var droppedObject = ui.draggable.data('object');

        //css reset
        $this.removeClass();
        $this.addClass("grape" + droppedObject);
        }

        //play drop sound
        audioClap.play();
    }
});

我已经尝试过循环并将计数值添加到类中以便每次更改它但我做错了什么!

2 个答案:

答案 0 :(得分:1)

尝试这样的事情:

var drop_count = 0;

$('#droppableChoking').droppable({
    drop: function (event, ui) {
        //reuse jQuery object
        var $this = $(this);

        //get object type
        var droppedObject = ui.draggable.data('object');

        //css reset
        $this.removeClass();
        $this.addClass("grape_" + drop_count);
        drop_count++;

        //play drop sound
        audioClap.play();
    }
});

答案 1 :(得分:0)

http://api.jquery.com/removeClass/ removeClass要求要从每个匹配元素的class属性中删除一个或多个以空格分隔的类。

因此,考虑到这一点,您对removeClass的调用不可能删除任何内容。如果您要清除课程,请执行$this.attr('class', '')

至于计数器,这是我更新的JS:

    var counter = 0;

    $('#droppableChoking').droppable({
            drop: function (event, ui) {
                ++counter;

                //reuse jQuery object
                var $this = $(this);
                //get object type
                var droppedObject = ui.draggable.data('object');
                //css reset
                $this.attr('class', '');
                $this.addClass("grape" + droppedObject);

                // what to do with counter?  not sure.  Whatever you want.  I'm setting text.  Not sure how you want to use it for the class.
                $this.text(counter);
                }
                //play drop sound
                audioClap.play();
            }
        });