gpt4 book ai didi

javascript - jQuery 在子窗口中打开对话框可防止在主窗口中切换、隐藏或显示

转载 作者:行者123 更新时间:2023-12-03 05:32:17 25 4
gpt4 key购买 nike

我有一个较旧的代码库,其中冗长过程的最后一页有一个结果页面,带有一些 Accordion 式控件,以及一个“打印此”按钮,用于打开同一报告的打印机友好版本。当适合打印的页面打开时,它会自动弹出打印对话框。

对话框打开后,在新选项卡中,如果用户使用 Chrome,用户可以切换回原始选项卡,但切换按钮不再起作用。 jQuery hideshow 函数也不再起作用。相反,他们似乎在排队,但是却延迟了。一旦用户切换回子选项卡,并关闭打印对话框或关闭选项卡,则所有切换、隐藏和显示函数调用都会以背对背的方式发生。

这可能看起来像是一种边缘情况,但我需要知道是否有一种方法可以防止子窗口阻止父窗口中的功能,在打印对话框关闭之前禁用控件,或者禁用控件直到子选项卡关闭。

下面是演示该问题的示例代码:

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

最佳答案

据我了解,这是 Chrome 的一个 bug,阻止了所有使用 setIntervalsetTimeout 的代码。 toggle的动画使用了setInterval,所以被阻塞了。有多种方法可以解决此问题:

  1. 使用不带参数的.toggle,不使用动画。
  2. 禁用主页上的按钮,可以选择显示一条消息,告诉用户在关闭打印对话框之前此页面不处于事件状态,方法是添加以下代码:

    // When the button is clicked, show/hide content
    $('#btn1').on("click", function() {
    $('#div1').toggle("slow");
    });
    window.disableBtns = function () {
    // Optionally show some warning message
    $('#btn1').attr('disabled', true)
    console.log('disable');
    };
    window.enableBtns = function () {
    $('#btn1').attr('disabled', false)
    console.log('enable');
    };

    // 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 ) {
    opener.disableBtns();
    window.print();
    opener.enableBtns();
    }

关于javascript - jQuery 在子窗口中打开对话框可防止在主窗口中切换、隐藏或显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40891299/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com