Перенаправить на новую страницу через диалоговое окно

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

Ниже следует делать то, что вам нужно.

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);
});

<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>

Answer 2

jQuery имеет отложенный объект с именем when().Используйте этот объект.

Пример:

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' );*/
    } );
}

<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>

Answer 3

Вы можете использовать confirm:

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