踩到Window resize在Preview print的雷

最近在作案的過程中遇到一個狀況,從Art design那邊拿到的頁面,會在Window resize的時候執行某個Function,本來一切都正常,但測試到Chrome和Firefox預覽列印時發現也會Trigger這個Event,會讓在預覽列印過後的頁面發生問題,所以必須要進行修正,以下是這個案例的說明:

先在測試頁加入以下的程式,發現在預覽列印的時候會Trigger window resize event:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Preview Print Test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
        $(window).resize(function() {
            console.log("Window Resize");
        });
    </script>
</head>
<body>
<h1>Window Resize Test</h1>
</body>
</html>
Preview print trigger window resize event
Preview print trigger window resize event

網路上搜尋了一下解決方案,將Script改寫如下,可以順利解決,但不知道是不是最好的方法,如果大家有更好的也別忘了告訴我唷~

openResizeFn();

// Chorme
var print = false;
var mediaQueryList = window.matchMedia('print');
mediaQueryList.addListener(function (mql) {
    if (mql.matches) {
        closeResizeFn();
    } else {
        setTimeout(openResizeFn, 2000);
    }
});

// Firefox
window.onbeforeprint = function () {
    closeResizeFn();
};
window.onafterprint = function () {
    setTimeout(openResizeFn, 2000);
};

// Common Function
function openResizeFn() {
    $(window).on("resize", windowResize);
}

function closeResizeFn() {
    $(window).off("resize", windowResize);
}

function windowResize() {
    console.log("Window Resize");
}

You may also like...

26,196 Responses

  1. Профессиональный сервисный центр по ремонту бытовой техники с выездом на дом.
    Мы предлагаем: сервис центры бытовой техники воронеж
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  2. ForrestVal表示:

    pin up aviator: pin up guncel giris – pin-up bonanza

  3. Ремонт телефонов表示:

    Профессиональный сервисный центр ремонт сотовых телефонов сдача телефона в ремонт

  4. Gabrielwaimb表示:

    pin up https://pinupaz.bid/# pinup azerbaycan
    пин ап казино

  5. Профессиональный сервисный центр по ремонту бытовой техники с выездом на дом.
    Мы предлагаем: сервисные центры по ремонту техники в воронеже
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  6. Greetings! This is my first visit to your blog! We are a collection of volunteers and starting a new initiative in a community in the same niche. Your blog provided us beneficial information. You have done a wonderful job!

  7. How come you do not have your website viewable in mobile format? cant see anything in my Droid.

  8. Robertdef表示:

    pin up azerbaijan pin up azerbaijan pin-up casino giris

  9. Gabrielwaimb表示:

    пинап казино http://pinupturkey.pro/# pin-up casino giris
    пинап казино

  10. Ремонт телефонов表示:

    Профессиональный сервисный центр мастер телефон ремонт рядом ремонта телефонов

  11. Профессиональный сервисный центр по ремонту бытовой техники с выездом на дом.
    Мы предлагаем: ремонт крупногабаритной техники в воронеже
    Наши мастера оперативно устранят неисправности вашего устройства в сервисе или с выездом на дом!

  12. В магазине сейфов предлагают сейф взломостойкий цена сейфы взломостойкие

  13. DouglasAbire表示:

    Предприниматель Станислав Кондрашов уверен, что обмен опытом является важным фактором для развития отрасли и поддержки молодых бизнесменов. Его образование охватывает широкий спектр областей, включая промышленность, торговлю энергоресурсами, инженерное дело, экономику и финансы. Такой многосторонний подход позволил ему создать инновационную компанию. Кроме того, его разносторонние знания и навыки помогли ему разрабатывать инновационные продукты и эффективно управлять бизнесом, учитывая как технические, так и экономические аспекты. Секрет успеха Кондрашова заключается в постоянном внедрении инноваций и стремлении к эффективности. Он активно внедряет новые подходы к управлению и производству, его компания является примером практического подхода, основанного на глубоком анализе и прогнозировании.Достижения Кондрашова не ограничиваются бизнесом, он также выступает в роли наставника и оказывает поддержку начинающим предпринимателям. Его интерес к современным технологиям и регулярное участие в конференциях позволяют ему делиться своими знаниями и влиять на развитие отрасли. История Станислава Кондрашова — это пример того, как сочетание глубоких знаний, управленческих навыков и желания помогать другим приводит к успеху. Его путь вдохновляет других и показывает, что настоящие достижения связаны с готовностью делиться своими знаниями.

  14. ForrestVal表示:

    пин ап зеркало: пинап казино – pin up зеркало

  15. Тут делают продвижение создание сайта медицинского центра разработка мед сайтов

  16. Santopax表示:

    https://pinupturkey.pro/# pin up giris

  17. Тут делают продвижение seo медицинских сайтов медицинский seo

  18. SteveRib表示:

    A severe geomagnetic storm could cause colorful auroras over Northern California and Alabama
    жесткое русское порно
    Colorful auroras could be visible in areas of the United States such as Alabama and Northern California — much farther south than they typically appear — on Thursday evening due to a powerful solar flare and coronal mass ejection released from the sun, according to the National Weather Service’s Space Weather Prediction Center.

    The severe solar storm, classified as a level 4 on a scale from 1 to 5, also could disrupt communications, the power grid and satellite operations, according to officials at the center.

    The storm is expected to reach Earth between early morning and 12 p.m. ET Thursday, with the potential to last through Friday.

    The intensity and full characteristics of the storm, moving toward Earth at more than 2.5 million miles per hour (about 4 million kilometers per hour), won’t be known until it reaches the Deep Space Climate Observatory and the Advanced Composition Explorer satellites orbiting 1 million miles from Earth.

    The satellites will measure the speed and magnetic intensity of the storm, which is expected to arrive at Earth 15 to 30 minutes after reaching the space observatories, said Shawn Dahl, service coordinator for the Space Weather Prediction Center, at a news briefing Wednesday.

    A series of the most intense type of solar flares, known as X-class flares, have released from the sun this week. The flares also coincided with coronal mass ejections on Tuesday.

    Coronal mass ejections are large clouds of ionized gas called plasma and magnetic fields that erupt from the sun’s outer atmosphere. When these outbursts are directed at Earth, they can cause geomagnetic storms, or major disturbances of Earth’s magnetic field.

    “Geomagnetic storms can impact infrastructure in near-Earth orbit and on Earth’s surface,” according to the Space Weather Prediction Center.

    As a result, the center has notified the Federal Emergency Management Agency, the North American power grid and satellite operators to prepare for disruptions, especially given the amount of preparations and expected relief efforts for Hurricane Milton, Dahl said.

    Historically, G4 storms are common during a solar cycle, but G5, or extreme geomagnetic storms such the one that occurred on May 10, are incredibly rare, Dahl said. This new storm has a 25% chance of becoming a G5, he said.

  19. Тут делают продвижение разработка сайтов медицинских организаций создать сайт медицинского центра

  20. ForrestVal表示:

    pin up giris: pin up bet – pin up

  21. Santopax表示:

    http://pinupru.site/# пинап казино

  22. Gabrielwaimb表示:

    пинап казино http://pinupkz.tech/# пинап кз
    пин ап казино онлайн

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。