Question

新手，试图混淆我的方式，代码有什么问题吗？第1-8行工作，然后按钮将不会继续到下一个div。

$(document).ready(function () {
    $('#personal-info, #cc-sub').hide()

    $('.amount_radio_button').click(function() {
        $('#donation-amount').hide('fast') 
        $('#personal-info').show('slow')

        $('.nextBtn1').click(function() {
            $('#personal-info').hide('fast') 
            $('#cc-sub').show('slow')

            $('#submit').click(function() {
                $('#cc-sub').hide('slow') 
                $('#thank_you').show('slow')    
            });                     
        });                     
    });     
});

Answer 1

您需要将事件处理程序设置在彼此旁边，而不是彼此嵌套。目前，事件处理程序只会在其他事件被注册时被注册。请尝试以下方法：

$(document).ready(function () {
    $('#personal-info, #cc-sub').hide()

    $('.amount_radio_button').click(function() {
        $('#donation-amount').hide('fast') 
        $('#personal-info').show('slow')
    });     

    $('.nextBtn1').click(function() {
        $('#personal-info').hide('fast') 
        $('#cc-sub').show('slow')                    
    });   

    $('#submit').click(function() {
        $('#cc-sub').hide('slow') 
        $('#thank_you').show('slow')    
    }); 
});

Answer 2

我认为问题在于您是否正在嵌套事件处理程序。你必须单独定义它们，而不是彼此内部。

$(document).ready(function () {
    $('#personal-info, #cc-sub').hide();

    // hide the donation amount, show person info next
    $('.amount_radio_button').click(function() {
        $('#donation-amount').hide('fast');
        $('#personal-info').show('slow');
    });     

    // hide personal info, show subscription info
    $('.nextBtn1').click(function() {
        $('#personal-info').hide('fast');
        $('#cc-sub').show('slow');
    });

    // hide subscription info, show thank you section
    $('#submit').click(function() {
        $('#cc-sub').hide('slow');
        $('#thank_you').show('slow');
    });

});

JQuery隐藏/显示无法正常工作

2 个答案: