javascript - 用其他按钮替换按钮

Question

我有 2 个 button 元素。单击第一个按钮时，第二个按钮出现，第一个按钮消失。 @Fiddle

$(document).ready(function () {
    $("#startClock").click(function () {
        $("#startClock").fadeOut().delay(120000).fadeIn();
        $("#submitamt").fadeIn().delay(120000).fadeOut();         
    });
});

<button class="rightbtn" type="button" id="startClock">Start</button>
<button class="rightbtn" type="button" id="submitamt" style="display:none;">Submit</button>

一切正常，但是当第二个按钮替换第一个按钮时，它会从右向左滑动。我希望第二个按钮应该直接替换第一个按钮，而不滑动/占用任何空间/不影响 CSS

谁能告诉我怎么做？

Answer 1

试试这个，可能会有帮助

你需要使用回调

$(document).ready(function () {
    $("#startClock").click(function () {
        $("#startClock").fadeOut(function(){
          $("#submitamt").fadeIn().delay(120000).fadeOut(function(){
                   $("#startClock").delay(120000).fadeIn();
          });
        })

    });
});

或者只是

 $(document).ready(function () {
        $("#startClock").click(function () {
            $("#startClock").fadeOut(function(){
              $("#submitamt").fadeIn().delay(120000).fadeOut(function(){
                       $("#startClock").fadeIn();
              });
            })

        });
    });

在这种情况下，它只会延迟 120000 毫秒。

Updated Fiddle