jQuery Mouseupは2回目のクリックでのみトリガされます

Question

ラベルによって選択されているチェックボックスがあります。私はその後、選択されたクラスを親liに追加します。これが起こると、私はページ上の '.gquiz-correct-choice .gquiz-indicator'のインスタンスを数えたいと思う。

2回目をクリックするとカウントが更新されます。

私は 'return false'を追加しようとしました。マウスの代わりに変更を使用して、クリック& 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イベントは発生しません。コンソールに印刷しようとしました。これで あなたは、両方のイベントが同時に（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

発射されるのmouseupをクリックする前に実行されるので、これが起こる参照codepen。

あなたの問題を解決する方法は次のとおりです。

// 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; 
    }); 
});