通过对话框

Question

我们正尝试使用javascript / jquery将用户通过按钮重定向到新页面。单击该按钮时，一段文本也会被复制到剪贴板。用户收到确认此文本已被复制的警报。 然后，我们希望该网站重定向到新页面。通过单击警报上的“确定”按钮，或者自动进行。

这可以通过警报吗？我们可以在用户点击按钮时创建自动延迟重定向，以便他们同时看到警报消息并重定向一段时间吗？

代码在这里：

<div class="country-container">
          <button class="promocode" onclick="copyToClipboard('#p1')">
          <p style="text-decoration: none;">Use promocode:<br><span id="p1">SPAIN-2018</span></p>
</div>   

    <script>      
    function copyToClipboard(element) {
      var $temp = $("<input>");
      $("body").append($temp);
      $temp.val($(element).text()).select();
      document.execCommand("copy");
      $temp.remove();

      alert(“You’ve copied the promo code " + $temp.val());
    }    
    </script>    

谢谢！

Answer 1

您可以使用confirm：

if (confirm("OK?")) {
  window.location.replace("http://stackoverflow.com");
} else {
  window.location.replace("http://stackoverflow.com");
}

Answer 2

以下应该做你需要的。

＆＃13;

＆＃13;

function copyToClipboard(element) {
    var $temp = $("<input>");
    $("body").append($temp);
    $temp.val($(element).text()).select();
    document.execCommand("copy");
    $temp.remove();

    alert("You’ve copied the promo code " + $("#p1").text()); 
  }
  
$("button").click(
    function() {
        setTimeout(
            function() {
               //alert("Redirect here");
               window.location.replace("http://stackoverflow.com");
            },
            1000);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="country-container">
  <button type="button" class="promocode" onclick="copyToClipboard('#p1')">
  <p style="text-decoration: none;">Use promocode:<br>
  <span id="p1">SPAIN-2018</span></p>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

jQuery有一个名为when()的延迟对象。使用此对象。

示例：

＆＃13;

＆＃13;

function copyToClipboard( element ) {
    var $temp = $( '<input>' );

    $( 'body' ).append( $temp );
    $temp.val( $( element ).text() ).select();
    document.execCommand( 'copy' );
    $temp.remove();
    alert( 'You\'ve copied the promo code ' + $temp.val() );
}

function redirect() {
    $.when( copyToClipboard( '#p1' ) ).done(function( ) {
        $( '.country-container' ).text( 'redirected to: http://stackoverflow.com' );
        /*window.location.replace( 'http://stackoverflow.com' );*/
    } );
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="country-container">
    <button class="promocode" onclick="redirect()">Copy to Clipboard</button>
    <p style="text-decoration: none;">Use promocode:<br><span id="p1">SPAIN-2018</span></p>
</div>

＆＃13;

＆＃13;

＆＃13;