DIV でのダブルクリックを無効にしようとしています。いくつかの異なる推奨ソリューションを試しましたが、うまくいかないようです。
ユーザーが選択できる true false ボタンを表示しているステートメントがあります。#answerContainer が表示され、「次のステートメント」というリンクとともに回答が提供されるため、ユーザーが true または false を選択しても問題ありません。私の問題は、ユーザーが「NEXT STATEMENT」をダブルクリックすると、設定されたアニメーションが重なり始めることです。
#nextS (NEXT STATEMENT") リンクのダブルクリックを無効にすることはできますか?
ありがとう!
$(document).ready(function(){
var questions = ["This is question 1","This is question 2","This is question 3"];
var answers = ["<strong>FALSE: </strong> This statement is not true.","<strong>TRUE: </strong> This statement is true.","<strong>TRUE: </strong> This statement is true."];
$('#nextS,#bTrue,#bFalse').css( 'cursor', 'pointer' );
var z = 0;
$('#questions').html(questions[z]);
$('#bTrue,#bFalse').bind('click',function(e){
e.preventDefault();
$(this).prop('disabled', true); // DISABLE
$('#bTrue,#bFalse').fadeOut('fast', function(){
// Animation complete
$('#right').animate({top:0}, 800, function() {
//callback
$('#true-false').css('background-image', 'url(' + tf[z] + ')');
$('#true-false').fadeIn();
$('#answerContainer').html(" ");
$('#answerContainer').fadeIn(800, function() {
$('#bTrue,#bFalse').prop('disable', false); // ENABLE after container fades out
//callback
$('#answerContainer').html(answers[z] + "<p id=\"nextS\"><a href=\"#\">NEXT STATEMENT</a></p>");
//NEXT STATEMENT CLICK
$('#nextS').bind('click',function(e){
e.preventDefault();
$(this).prop('disabled', true); // DISABLE
z++;
$('#true-false').fadeOut();
$('#answerContainer').fadeOut(800, function(){
//callback
$('#right').animate({top:175}, 800, function(){
$('#questions').html(questions[z]);
checkZ();
//alert(questions[z]);
});
});
});
//NEXT STATEMENT CLICK
$('#nextS').prop('disable', false); // ENABLE after container fades out
});
});
});
});
});