1

我有一个简单的内容滑块。当有人多次点击红色方块时，幻灯片会堆叠起来。
我使用 setTimeout 来防止它工作时的多次点击，但它再次堆积起来。取消绑定/绑定也不起作用。在这个 jsFiddle 代码中，我放了一个示例。当有人单击红色方块时，我应该怎么做才能防止多次显示下一张幻灯片？

这是我与 unbind 一起使用的代码，但不起作用： 

$(function(){
    $(".circle").click(function(e){
        $(".circle").unbind('click');
        var ref = $(this);
        var id= parseInt(ref.attr('id'));
        $(".circle").attr('src','inactive-circle.gif');
        ref.attr('src','active-circle.gif');
        $(".boxicon").fadeOut(50,function(){
            $("#slide"+id).fadeIn(450);
            $(".circle").bind('click');
        });



    });
})

最终结果稍作改动： 

$(".circle").click(function() {
    var id = parseInt($(this).attr('id'), 10);
    $(".circle").attr('src', 'inactive-circle.gif');
    $(this).attr('src', 'active-circle.gif');
        $(".boxicon").hide();
    $("#slide" + id).stop(true, false).fadeIn(250);
});
4

1 回答 1

1

我可以看到一些错误，

当你在做 avar ref = $(this)时，你就不需要做 a $(ref)，

所以你是线条，

$(ref).attr('id') 

$(ref).attr('src','active-circle.gif');

将会，

ref.attr('id') 

ref.attr('src','active-circle.gif');

这也可能会导致一些问题，

你想达到什么目的？

Just had a look at your markup in the fiddle, by that, your jQuery looks a bit messed up for a content slider.

UPDATE

$(function() {
    $(".circle").click(function() {
        var id = parseInt($(this).attr('id'), 10);

        /*the .each() here is optional, you can always do this,
        $(".circle").attr('src', 'inactive-circle.gif');
        */
        $(".circle").each(function() {
            $(this).attr('src', 'inactive-circle.gif');
        });


        $(this).attr('src', 'active-circle.gif');

        /*the .each() here is optional, you can always do this,
        $(".boxicon").fadeOut(50);
        */    
        $(".boxicon").each(function() {
            $(this).fadeOut(50);
        });

        $("#slide" + id).stop(true, true).fadeIn(450);

    });
})​;

made appropriate changes (based on your markup), if you have any doubts, feel free to ask.

Fiddle Link (Have removed unused markup).

于 2012-07-21T07:30:12.580 回答