當非常快速地點擊選項卡時，兩個選項卡的選擇

Question

當嘗試點擊選項卡非常快兩個選項卡被選中Jquery SmartWizard.js插件我試過這種方式，但沒有運氣任何人經歷過這一點......也試過.on /.off事件沒有運氣。

$($this.steps).bind("click", function (e) { 

    //e.stopImmediatePropagation();  
    $($this.steps).unbind("click"); 

    if ($this.steps.index(this) == $this.curStepIdx) { 

     return false; 
    } 
    var nextStepIdx = $this.steps.index(this); 
    var isDone = $this.steps.eq(nextStepIdx).attr("isDone") - 0; 
    if (isDone == 1) { 
     _loadContent($this, nextStepIdx); 
    } 

    $($this.steps).bind("click"); 
    return false; 
}); 

Answer 1

喜傢伙的感謝您對我的努力，通過使用UI塊增效

$($this.steps).on("click", function (e) { 

    e.preventDefault(); 
    e.stopImmediatePropagation(); 
    if ($(this).attr('class') !== 'disabled' && $(this).attr('class') !== 'selected' && $(this).attr('class') !== 'error') { 

     $('div.swMain').block({ message: "Processing..." }); 
    } 

    try { 

     if ($this.steps.index(this) == $this.curStepIdx) { 

      $('div.swMain').unblock(); 
      return false; 
     } 

     var nextStepIdx = $this.steps.index(this); 
     var isDone = $this.steps.eq(nextStepIdx).attr("isDone") - 0; 
     if (isDone == 1) {   
      e.preventDefault(); 
      _loadContent($this, nextStepIdx); 

     } 
    } 
    catch (e) { 

     $($this.steps).on("click"); 
     console.log("Fast click Error ===> " + e); 
    } 


    if ($(this).attr('class') !== 'disabled' && $(this).attr('class') !== 'selected' && $(this).attr('class') !== 'error') { 

     $('div.swMain').unblock(); 
    } 

    return false; 
}); 

Answer 2

也許設置一個全局變量並檢查全局變量是否爲真？您可以在點擊後的很短時間內通過內置javascript delay（）函數設置一個短暫延遲。例如，

go=true; 
onclick: 
    go=false; 
    delay(100, some filler event); 
    go=true; 

編輯：此鏈接可能幫助：http://ejohn.org/blog/how-javascript-timers-work/

編輯：jQuery中試試這個：

$('id').click(function() {return false;}); 

然後設置一個延遲，並設置了回去。編輯：this似乎爲我工作。注意，如果您點擊鏈接兩次並延遲一段時間，它只會閃爍一次。除非你真的很快將垃圾郵件垃圾郵件發送了10次，否則它工作正常。 （使用最新的Chrome btw）

編輯：http://jsfiddle.net/ZDHZv/2/適合我。如果您將該方法用於製表符，則無法獲得雙重選擇。實現一個與你在$('.selected')

Answer 3

使用任何插件，我平時做這樣的事情：

var selection; 
$('a').click(function() { 
    if (selection !== undefined) { 
     selection.removeClass('selected'); 
    } 
    selection = $(this); 
    selection.addClass('selected'); 
}); 

http://jsfiddle.net/ZDHZv/7/

但它發生，我認爲你也可以做到這一點，假設所有標籤是兄弟姐妹，沒有別的是：

$('a').click(function() { 
    $(this).addClass('selected'); 
    $(this).siblings().removeClass('selected'); 
}); 

http://jsfiddle.net/ZDHZv/9/

Answer 4

你可以嘗試這樣的事情：

var process = false; 
$($this.steps).bind("click", function (e) { 
    if (process) { 
     return false; 
    } 
    process = true; 

    if ($this.steps.index(this) == $this.curStepIdx) { 

     return false; 
    } 
    var nextStepIdx = $this.steps.index(this); 
    var isDone = $this.steps.eq(nextStepIdx).attr("isDone") - 0; 
    if (isDone == 1) { 
     _loadContent($this, nextStepIdx); 
    } 
    process = false; 
    return false; 
}); 

Answer 5

我readed你的400個多行源代碼後，我想我知道問題出在哪裏。

它在函數_loadContent中。由於ajax，內容加載是異步的，並且您在ajax加載之後設置了選擇。

因此，當前一個標籤加載完畢後，即可點擊下一個標籤。

我得到兩個答案給你。

1. 創建Ajax synchronized.Like

   ​​

   它可以承諾的選擇，所有的訂單。但是，如你所知，它會迫使用戶等待，直到內容加載完成。

2. 立即設置選中，並在之後設置錯誤樣式。像

   ... 
   var stepNum = stepIdx + 1; 
   _showStep($this, stepIdx);// add this to set selected immediately. 
   if (ajaxurl && ajaxurl.length > 0) { 
       if ($this.options.contentCache && hasContent) { 
        return; // remove this and other _showStep calls. 
       } else { 
        var ajax_args = { 
         ... 
         error : function() { 
          $this.loader.hide(); 
          $this.showError(stepIdx);// show error. 
         }, 
         ... 
   

   選定的順序是可以的。但是，Ajax加載和錯誤樣式將變得異步。

這是你的電話。