1

它有点晚了,如果我犯了一个愚蠢的错误,请原谅我。出于某种原因,以下代码:

$(".myClass").each(function(){
    widths[$(this).attr("id")] = $(this).width();   
    if ($(this).attr("id")  != $(clickedExpand).attr("id"))
    {
        $(this).animate({
            width: '10px'
        });
    }

});

数组初始化为

var widths = new Array();

在代码的前面。出于某种原因,尽管我在动画开始之前记录了宽度,但我在数组中获得了动画后的值。似乎动画结束了,然后值被记录下来。我试图将它从函数中取出并将其包装在另一个 .each 中,但我得到了相同的结果。

任何帮助将不胜感激!

整个代码:

var slateWidths = {};
$(".slateExpand").click(function(){
    var clickedExpand = $(this).closest(".slate");

    $(".slate").each(function(){
        slateWidths[$(this).attr("id")] = $(this).outerWidth();   
        if ($(this).attr("id")  != $(clickedExpand).attr("id"))
        {
            $(this).animate({
                width: '10px'
            });
            $(this).find($('.slateExpand')).hide();
        }

    });

    $(this).text("Restore");
    $(this).removeClass("slateExpand").addClass("slateRestore");
    $(".slateRestore").on("click",function(){

        $(".slate").each(function()
        {
            alert(slateWidths[$(this).attr("id")]);
            //var width = slateWidths[$(this).attr("id")];
            $(this).animate({
                width: slateWidths[$(this).attr("id")]
                });
        });
    });
});
4

2 回答 2

1
// first of all save all widths for all .slate
var slateWidths = {};
$(".slate").each(function(){
    slateWidths[$(this).attr("id")] = $(this).width();
});

$(".slateExpand").click(function(){
    var $slate = $(this).closest('slate');    

    if($slate.hasClass('hidden')) {

        $slate.animate({
            width: slateWidths[$slate.attr('id')]
        });
        $(this).text("hide");
        $slate.removeClass("hidden")        
    }else{

        $slate.animate({
            width: '10px'
        });
        $(this).text("Restore");
        $slate.addClass("hidden")
    }    
});
于 2012-08-26T16:30:25.413 回答
0

好的,如果您遇到类似的问题,有一个简单的解决方案。问题是尽管类发生了变化,但点击并没有从 div 中解除事件的绑定。结果,它首先重新运行记录宽度的代码。这会导致动画无法播放,因为现在之前的宽度与当前的宽度相同。要解决这个问题,只需添加

   $("theDiv").unbind("click);

删除事件处理程序。这将防止触发上一个类的单击事件。

于 2012-08-26T16:42:29.847 回答