Question

我一直在通过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();

Answer 1

你可以试试这个：

  $('button.next').last().hide();

Answer 2

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

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

隐藏最后一个元素不起作用

2 个答案: