jQuery的切換與負載跨度

我有一堆的顯示和使用jQuery切換隱藏jQuery的切換與負載跨度

我目前使用此代碼來顯示和隱藏它與類自由度項目：

$('.dof').toggle();

其中工程很棒，但需要大約30秒才能完成切換。

我說這顯示加載圖像：

<a href="#" onclick="$('#loading').show();$('.dof').toggle();$('#loading').hide();"> 
    Toggle DOF 
</a> 

<span id="loading" style="display:none;"> 
    <img src="/assets/ajax-loader.gif" /> 
</span>

這不是顯示加載跨度。我可以確認加載圖像顯示是否顯示：無;

我在做什麼錯？

編輯

我想這從約西亞Ruddell的建議

（原諒我用coffescript，所以我把它轉換所有coffescript然後回來這裏展出）

$('#toggledof').click(function() { 
    var $dofs, doflen, toggleComplete; 
    $("#loading").show(); 
    toggleComplete = function() { 
    return $("#loading").hide(); 
    }; 
    $dofs = $(".dof"); 
    doflen = $dofs.length; 
    return $dofs.each(function(i) { 
    $(this).toggle(); 
    if (i === doflen - 1) { 
     return toggleComplete(); 
    } 
    }); 
});

然後我將a標籤更改爲：

<a href="#" id="toggledof"> 
    Toggle DOF 
</a>

來源

2011-10-10 Toby Joiner

當你說需要30秒的時間你在說30秒的動畫，或者頁面上有這麼多元素，需要30秒才能隱藏它們？ –

30秒來隱藏/顯示它們全部 –

我固定的問題與此代碼，我猜.toggle()當你正在處理的1900元很爛....

的HTML

<div id="testdof" style="display:none"></div> <!-- because the dof elements are hidden at page load -->

然後jQuery的

$('#toggledof').click(function() { 
    if ($('#testdof').css('display') === 'none') { 
    $(".dof").show(); 
    $("#testdof").show(); 
    } else { 
    $(".dof").hide(); 
    $("#testdof").hide(); 
    } 
});

這個運行速度足夠快以至於不關心加載元素。

來源

2011-10-10 20:57:57

由於動畫持續時間選項，切換功能不同步。您可以指定切換回撥。

$('.dof').toggle(function(){ 
    $('#loading').hide(); 
});

但是，如果有多個頁面上.dof元素，回調會發生的每一個。

更新您將需要跟蹤切換進度中的位置。所有項目都被切換後，顯示加載程序。另外，您可以考慮優化選擇器以提高此操作的速度。至少您可以在.之前添加節點名稱，例如div.dof。

var toggleComplete = function(){ 
     $('#loading').hide(); 
    }, 
    $dofs = $('.dof'), 
    doflen = $dofs.length; 

$dofs.each(function(i){ 
    $(this).toggle(); 
    if(i == doflen -1) toggleComplete(); 
});

來源

2011-10-10 16:34:39

我將添加上面我嘗試過的代碼，但仍無法顯示加載範圍。 –

我不認爲在最後隱藏該跨度甚至是一個問題，它似乎做得很好，它會在它運行切換之前顯示它。 –

也，我有td.dof和th.dof字段。我嘗試將它們添加到開始時的一個onclick中，而且速度也一樣慢。 –

要確定切換的速度，你可以使用重載函數：

$(selector).toggle(speed);

其中速度參數可以採取以下值：「慢」，「快速」，「正常」，或以毫秒爲單位的時間。

這將使您的動畫按照您所希望的速度。

來源

2011-10-10 16:37:27 Manish

對不起，我沒有指定足夠好，需要30秒來隱藏或顯示它們，我不想設置速度。我正試圖在處理過程中顯示加載圖像。 –

jQuery的切換與負載跨度

回答

相關問題