jQuery Mouseup只觸發第二次點擊

Question

我有一個複選框被標籤選中。然後，我添加一個選定的類到父李。一旦發生這種情況，我想計算頁面上'.gquiz-correct-choice .gquiz-indicator'的實例。

只有當我再次單擊時，計數纔會更新。

我試過添加'return false'。綁定點擊& mouseup，使用更改而不是mouseup，但我似乎無法使其工作。

jQuery(document).on('click', '.gfield_radio li label', function(event) { 
    jQuery(this).parent('li').addClass('selected'); 
}); 

jQuery('.gfield_radio li label').mouseup(function(){ 
    var numItems = jQuery('.gquiz-correct-choice .gquiz-indicator').length; 
    jQuery('.pts').html(numItems + '/20'); 
    return false; 
    }); 

Answer 1

第一次單擊似乎是「劫持」，所以我決定增加一個超時後運行計數。

jQuery(document).on('click', '.gfield_radio li label', function(event) { 
jQuery(this).parent('li').addClass('selected'); 
    setTimeout(
     function() { 
      var numItems = jQuery('.gquiz-correct-choice .gquiz-indicator').length; 
      jQuery('.pts').html(numItems + '/20');   }, 
     500); 
    }); 

Answer 2

對錯誤jquery事件不會被解僱只是試圖打印到控制檯。 在這個codepen你看到這兩個事件同時（http://codepen.io/f7o/pen/vKxKXX）

jQuery('.clickit ul li').click(function(event) { 
    console.log('added class') 
    jQuery(this).parent('ul').addClass('selected'); 
}); 

jQuery('.clickit li').mouseup(function() { 
    console.log('count') 
}); 

Answer 3

解僱這是因爲鼠標鬆開被點擊之前執行。

爲您解決問題的方法是：

// global variable to test if mouse 
var mousedUpFired = false; 

function doMouseUp() { 
    var numItems = jQuery('.gquiz-correct-choice .gquiz-indicator').length; 
    jQuery('.pts').html(numItems + '/20'); 
} 


jQuery(document).on('click', '.gfield_radio li label', function(e) { 
    jQuery(this).parent('li').addClass('selected'); 

    // check if mouseup has been triggered 
    // if yes, execute what contained in your old mouseup event handler 
    if (mousedUpFired) { 
    doMouseUp(); 
    } 
    // reset global variable 
    mousedUpFired = false; 
}); 


$(function() { 
    jQuery('.gfield_radio li label').mouseup(function(e){ 
    // set global variable on mouseup and do nothing 
    mousedUpFired = true; 
    }); 
});