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

28,552 Responses

  1. Jasonzitte表示:

    Their adherence to safety protocols is commendable.
    where can i get cheap cytotec without dr prescription
    A game-changer for those needing international medication access.

  2. Victorprima表示:

    Consistent excellence across continents.
    how can i get cheap cipro online
    drug information and news for professionals and consumers.

  3. Victorprima表示:

    Speedy service with a smile!
    where to get generic clomid without prescription
    A touchstone of international pharmacy standards.

  4. DonaldTyclE表示:

    vibracion de motor
    Equipos de balanceo: importante para el rendimiento uniforme y optimo de las dispositivos.

    En el ambito de la ciencia avanzada, donde la productividad y la seguridad del aparato son de gran trascendencia, los dispositivos de ajuste desempenan un papel vital. Estos sistemas adaptados estan creados para calibrar y regular componentes giratorias, ya sea en dispositivos manufacturera, vehiculos de transporte o incluso en aparatos hogarenos.

    Para los profesionales en mantenimiento de sistemas y los ingenieros, manejar con dispositivos de balanceo es fundamental para garantizar el rendimiento estable y seguro de cualquier sistema movil. Gracias a estas alternativas tecnologicas modernas, es posible limitar sustancialmente las movimientos, el ruido y la presion sobre los sujeciones, aumentando la vida util de componentes costosos.

    Asimismo trascendental es el papel que desempenan los sistemas de calibracion en la servicio al comprador. El apoyo profesional y el reparacion continuo utilizando estos dispositivos habilitan proporcionar soluciones de excelente excelencia, incrementando la bienestar de los consumidores.

    Para los responsables de negocios, la contribucion en unidades de equilibrado y dispositivos puede ser clave para optimizar la eficiencia y rendimiento de sus sistemas. Esto es particularmente relevante para los duenos de negocios que dirigen modestas y medianas organizaciones, donde cada punto cuenta.

    Por otro lado, los sistemas de balanceo tienen una amplia uso en el ambito de la fiabilidad y el supervision de nivel. Facilitan encontrar posibles fallos, impidiendo mantenimientos elevadas y averias a los equipos. Ademas, los datos obtenidos de estos equipos pueden usarse para mejorar sistemas y mejorar la visibilidad en buscadores de investigacion.

    Las zonas de implementacion de los equipos de calibracion comprenden diversas ramas, desde la produccion de transporte personal hasta el monitoreo de la naturaleza. No importa si se habla de grandes producciones productivas o limitados talleres caseros, los aparatos de ajuste son esenciales para garantizar un funcionamiento optimo y sin detenciones.

  5. Jasonzitte表示:

    Delivering worldwide standards with every prescription.
    can i order lisinopril without prescription
    Trustworthy and reliable, every single visit.

  6. Jasonzitte表示:

    Always up-to-date with international medical advancements.
    where to get generic clomid without a prescription
    A universal solution for all pharmaceutical needs.

  7. Jasonzitte表示:

    Always ahead of the curve with global healthcare trends.
    is cytotec a brand name
    They never compromise on quality.

  8. TolikIncap表示:

    dark web drug marketplace https://github.com/darknetmarketlistv8tg0/darknetmarketlist – darknet markets onion

  9. Victorprima表示:

    A trusted name in international pharmacy circles.
    lisinopril alternatives no prescription
    The team embodies patience and expertise.

  10. Jasonzitte表示:

    Efficient, effective, and always eager to assist.
    gabapentin otc
    earch our drug database.

  11. Victorprima表示:

    Consistent service, irrespective of borders.
    where buy cheap cytotec pill
    Their global distribution network is top-tier.

  12. Jasonzitte表示:

    A pharmacy that genuinely cares about community well-being.
    how can i get gabapentin
    Get information now.

  13. Pingidiof表示:

    darknet market links https://github.com/aresmarketlink0ru72/aresmarketlink – dark web marketplaces

  14. WalterCherm表示:

    Setting global standards in pharmaceutical care.
    https://clomidpharm24.top/
    They’re reshaping international pharmaceutical care.

  15. Victorprima表示:

    Their international health forums provide crucial insights.
    cost fluoxetine
    Consistency, quality, and care on an international level.

  16. WalterCherm表示:

    I always find great deals in their monthly promotions.
    https://cipropharm24.top/
    Leading the way in global pharmaceutical services.

  17. WalterCherm表示:

    They have an impressive roster of international certifications.
    https://lisinoprilpharm24.top/
    Delivering worldwide standards with every prescription.

發佈留言

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