踩到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...

15,680 Responses

  1. DouglasHoapy表示:

    1xBet Promo Code Free Spins https://actuchomage.org/includes/wkl/code_promo_69.html
    1xBet offers promo codes that provide free spins on various slot games. These codes can be used in the casino section of the site, giving players the chance to win without risking their own money. Free spins are a popular reward for both new and existing users.

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

  3. Cafe Carlucci (2901 Sheffield), Brother Jimmy’s (barbecue, 2909 Sheffield); Panes Bread Cafe (3002 Sheffield); Little Habana (3006 Sheffield, Cuban), Pianetto’s (3114 Sheffield, Italian); Pat’s Pizza (3114 Sheffield); Star of India (3204 Sheffield), Leona’s (Italian, 3215 Sheffield), Blue Iris (3216 Sheffield; southwestern), Le Loup (3348 Sheffield), Sazerac (3358 N. Sheffield), Customary of India (917 Belmont), Pastafina (921 Belmont), Carmen’s Pizza (964 Belmont), Bella Vista (1001 Belmont; yuppie Italian), Moti Mahal (Indian, 1031 Belmont), Jeanny’s (1053 W. Belmont, Chinese language); Jasmine Thai (1123 Belmont);Desert Treat (1125 Belmont), Novitá (1232 Belmont; Italian), El Pacifico (Mexican, 1358 Belmont), Taqueria las Americas (1434 Belmont), Golden Szechuan (1455 Belmont), Home of Noodles (Sichuan, 1610 Belmont), Zoom Kitchen (1620 Belmont), Las Tablas (2965 Lincoln, Colombian), Black Cat (2856 Southport; Italian nation-model), Little Bucharest (Rumanian, 3001 Ashland), Da Nicola (Italian, 3114 Lincoln, unusual menu), Arriba Mexico (3140 Lincoln; seafood, birria), Pablo’s (Mexican, 3056 Oakley), De Colores (3156 Lincoln, Mexican); Thurston’s (1248 W. George), Buca di Beppo (2941 Clark), Star of Thailand (3133 Clark), Alonti (3201 Clark), Mama Desta’s Red Sea (3215 Clark), House of Treasures (Cantonese, 3307 Clark), San Miguel (Spanish, 3311 Clark), Sala of Siam (3328 Clark),Thai Basic (3332 Clark), Mongolian Barbecue (3330 Clark), Texas Star Fajita Bar (3365 Clark), Sam Mee (3370 Clark), Siam Nook (3374 Clark), Pad Thai (3466 Clark), Tomodachi (Japanese, 3468 Clark), La Paillotte (Vietnamese, 3470 Clark), Arabesque (3472 Clark), Nagano (Japanese, 3475 Clark), Casbah Cafe (3156 Broadway), Kabuto (3329 Broadway, Japanese),Yugo Inn (Yugoslav, 2824 Ashland), Burgundy Inn (2706 Ashland), Zum Deutschen Eck (German, 2924 Southport).

  4. As an exercise it’s best to attempt to get via at the least a dozen monsters.

  5. Job proximity is not the one challenge.

  6. They don’t all the time get issues right-a specific amount of randomness is allowed for-however they’re precluded from making systematic errors.

  7. As full-time travelers, we have now rigorously thought-about a number of components so as to find the best possible sneakers for touring!

  8. In case your culinary department opens up into your dining room, you would possibly suppose about the dining room furnishings in related fashion.

  9. They are most likely the one ones who might afford it.

  10. After research a number of of the blog posts on your website now, and I truly like your method of blogging. I bookmarked it to my bookmark web site checklist and will likely be checking again soon. Pls check out my website as nicely and let me know what you think.

  11. Confidence: When your ft are snug, you’re more more likely to feel assured and relaxed.

  12. Put comfort and durability first.

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

  14. Audio began playing when I opened up this webpage, so annoying!

  15. 12. “You are an angel in disguise.

  16. Chrome, stainless steel, brass, copper, aluminum, and cast and wrought iron additionally can be used to make wine racks.

  17. The socialistic version is that you need to have a welfare state as a result of that’s what individuals would need behind a veil of ignorance.

  18. It means more than you recognize!

  19. In case you have glad clients who to sing your praises, make sure that to clearly show their testimonials in your webpage or social media sites.

  20. The graph below reveals that at 5-minute cycles, a CFL will last lower than 1/10 so long as a lamp working for ninety minutes at a time.

  21. HeathZex表示:

    pharmacie en ligne france pas cher: Pharmacies en ligne certifiees – pharmacie en ligne france pas cher

  22. T. H. Richardson, California U.S.A.

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

  24. 経済 厚生表示:

    Newspaper clipping, October, 11-12, 1980, regarding the a hundredth anniversary of the Leonardville United Methodist Church.

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

  26. In line with the Nationwide Coalition on Well being Care, in 2005, over eighty percent of staff have been eligible for employer-group insurance coverage and 83 percent of those who have been offered, opted for a lot of these plans.

  27. Just what I needed to know thank you for this.

  28. The easiest way to succeed in the Ruined Atoll, assuming you’re at the Forest Fortress, is through the use of a teleporter.

  29. There are many colorways to choose from, ranging from daring to impartial.

  30. HeathZex表示:

    Viagra en france livraison rapide: viagra en ligne – п»їViagra sans ordonnance 24h

發佈留言

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