長いコードの最後のページには結果ページといくつかのアコーディオンスタイルのコントロールがあります。 "ボタンをクリックすると、同じレポートのプリンタフレンドリなバージョンが開きます。プリンタフレンドリーなページが開くと、自動的に印刷ダイアログが表示されます。子ウィンドウのjQueryオープンダイアログは、メインウィンドウでのトグル、非表示、または表示を防止します
ダイアログが開いたら、新しいタブでユーザーがChromeを使用している場合、元のタブに戻ることができますが、トグルボタンは機能しなくなります。 jQuery hide
およびshow
も機能しなくなりました。代わりに、キューに入れられているように見えますが、遅延しています。ユーザーが子タブに戻り、印刷ダイアログを閉じるか、タブを閉じると、トグル、非表示、および表示のすべての関数呼び出しが連続して行われます。
これは端のように見えるかもしれませんが、子ウィンドウが親ウィンドウの機能をブロックするのを防ぐ方法、印刷ダイアログが閉じられるまでコントロールを無効にする方法、または無効にする方法があるかどうかを知る必要があります子タブが閉じられるまでコントロールします。私は周りに検索した後、それはsetInterval
とsetTimeout
を使用して、すべてのコードをブロックする、クロームのバグだ知っているから
<html><head></head><body>
<!-- Accordion content below. -->
<div id="div1">
Here is our content<br />
to be displayed.<br />
Part of the issue becomes<br />
more apparent when<br />
several lines are<br />
present.<br />
Lorem Ipsum...<br />
Lorem Ipsum...<br />
Lorem Ipsum...<br />
Lorem Ipsum...<br />
</div>
<!-- Our collapse/hide button. Will not work when print dialog is open
in child tab. -->
<button id="btn1">Show/Hide Content</button>
<!-- Our print button -->
<div><a href="test.php?print=true" target="_blank">Print in New Tab</a></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
// When the button is clicked, show/hide content
$('#btn1').on("click", function() {
$('#div1').toggle("slow");
});
// Flag used to determine whether we print this page. Pretend that there
// is more print-unfriendly cruft that would be removed if this were the
// print-friendly page.
var do_print = false
// if the ?print=true request variable has been appended to the url,
// trigger javascript that brings up the print dialog.
<?php if(isset($_REQUEST['print'])) :?>
do_print=true;
<?php endif ?>
if(do_print==true) {
window.print();
}
</script>
</body></html>