0

我一直在通过 jQuery 磕磕绊绊,并有以下几点:

<form class="form" method="POST" action="<?php the_permalink(); ?>">
<?php $counter = 1; if(get_field('step_by_step_training')): ?>
<?php while(the_repeater_field('step_by_step_training')): ?>    
    <div class="form-row">
        <p class="training"><?php echo the_sub_field('introduction'); ?></p>
        <button class="next">Next</button>
    </div>
<?php $counter++; endwhile; ?> 
<?php endif; ?> 
</form>

<script type="text/javascript">
jQuery(function($) {
$(document).ready(function() {    

    // prepend a 'previous' button to all form-rows except the first
    $('<button>').addClass('previous').text('Previous').prependTo($('.form-row').not(':first'));

    // hide all form-rows, but not the first one
    $('.form-row').not(':first').hide();

    // add the submit button to the last form-row
    $('<input>').prop('type', 'submit').val('Submit').appendTo($('.form-row:last'));


    // handle the previous button, we need to use 'on' here as the
    // previous buttons don't exist in the dom at page load
    $('.form-row').on('click', 'button.previous', function(e) {
        e.preventDefault();
        $(this).parent('div.form-row').hide().prev('div.form-row').show();
    });

    $('button.next').click(function(e) {
        // prevent the next buttons from submitting the form
        e.preventDefault();
        // hide this form-row, and show the next one
        $(this).parent('div.form-row').hide().next('div.form-row').show();
    });    

});
});
</script>

这是一个循序渐进的过程。

我想隐藏最后一步的下一步按钮,但似乎无法让它工作。我尝试了以下操作,但下一个按钮停止工作。

$('button.next').is(':last').hide();
4

2 回答 2

3

你可以试试这个:

  $('button.next').last().hide();
于 2012-09-21T09:42:16.130 回答
0

根据 jQuery 文档,当至少有一个元素与参数匹配时, is()返回 true。

所以你真正想做的是$('button.next').last().hide()或者$('button.next:last').hide()

于 2012-09-21T09:46:20.873 回答