Question

是否可以用按钮2替换buttons.i.e。，button1，依此类推，而无需更改按钮的位置。我还使用$( "#btn1" ).replaceWith( $( "#btn3" ) );按钮改变位置两个按钮。

<div>
    <button id="btn1" class="change-button">A button with some text 1</button>
    <button id="btn2" class="change-button">A button with some text 2</button>
    <button id="btn3" class="change-button">A button with some text 3</button>
</div>

$(".change-button").on("click", function(event){
    var buttonId = $(this).attr('id');
    var buttonText = $(this).html();
    $('#' + buttonId).replaceWith("<span>" + buttonText + "</span>");
});

Answer 1

试试这个版本。

Fiddle updated

$('div').on('click', '.change-button', function(event){
    var thisButton = $(this);
    var nextButton = $(this).next('.change-button');
    var cloneButton = thisButton.clone(true, true);

    thisButton.replaceWith(nextButton);
    $('div').append(cloneButton);
});

Answer 2

只需按下.hide()和.show()按钮即可。然后他们会保持秩序。

或者你真的是指固定位置？在这种情况下，您希望使用.css('visibility', 'visible')和.css('visibility', 'hidden')更改可见性。

用按钮替换按钮

2 个答案: