0

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("&nbsp;");
            $('#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


            });
        });
    });
});
});
4

1 に答える 1