показ окна печати после подтверждения

Question

У меня есть случай, когда мне нужно сначала показать диалоговое окно подтверждения, и если пользователь нажмет кнопку «ОК», появится окно печати, а если пользователь нажмет «Отмена», то окно печати не отобразится.

a href = "#" class = "btn btn-sm основной float-right hidden-print <% = params [: print_on_load]?" Mandatory_print_invoice ":" "%>" onClick = "window.print (); "> Распечатать"

Здесь окно печати отображается после нажатия на печать. Но я должен сначала показать диалоговое окно подтверждения после нажатия на печать, затем оно покажет окно печати

Answer 1

Попробуйте это:

var $dialog_btn = $('#dialog-btn'),
    $print_box = $('#print-box'),
    $print_btn = $('#print-btn');

$dialog_btn.on('click', function(e){
  e.preventDefault();
  $print_box.fadeIn();
});
 
 
$print_btn.on('click', function(e){
  e.preventDefault();
  window.print();
});

#print-box {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 9999;
  background: #f0f0f0;
  box-shadow: 0 0px 5px #000;
  transform: translate(-50%,-50%);
  font-size: 20px;
  font-weight: bold;
  padding: 50px;
}

#print-box a {
  text-decoration: none;
  color: #fff;
  padding: 7px 10px;
  background: red;
}

#dialog-btn {
  color: #fff;
  font-size: 20px;
  text-decoration: none;
  padding: 7px 10px;
  background: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#" id="dialog-btn">Show dialog</a>

<div id="print-box">
  <a href="#" id="print-btn">Print?</a>
</div>

Answer 2

Попробуйте этот код.

$(document).on('click','button',function()
{
   if(confirm("Print"))
   {
     window.print();
   }
});

Answer 3

Вы должны сделать это так

document.querySelector('button').onclick = () => {
  if (confirm("Do you want to print?")) {
    window.print();
  }
}

<button>Print</button>