使用window.print()打印HTML表单

Question

我的任务是构建指向DB的HTML表单链接。这里没问题。

问题是，我需要用户能够打印该表单。因此，我使用HTML按钮构建了一个“打印按钮”，并在其后面放置了一些JQuery，这样表单就可以正确地格式化(删除一些边框、背景图像等等)，并使用window.print()打印我的表单。

以下是问题所在：

我的表格有6到7页长。

但它希望在Google上打印得很好(所有部分都在单独的页面上)，但在IE (最新版本)中，一些字段和一些部分在某些页面上被“切成两半”。

我认为问题在于IE如何使用边距和垫子。

我还检查了可以在谷歌上传递给window.print()的任何参数，认为它可能会有帮助，但什么也找不到。

有人能提供另一种方式或另一种我可以使用的功能，使我的表单在两个浏览器上打印时看起来都一样吗？或者也许有人可以指出如果我犯了一个错误。

这是我的代码：

HTML：

<div id="divCodeSecurite">
    <h3 class="Titre">Codes de sécurité des ascenseurs</h3>
        <span class="SHL MixteLeft" id="CodeSecuriteLeft">
            <input type="radio" id="B442007" name="CodeSecurite" value="B44-2007"/>
            <label for="B442007">B44-2007</label>
            <input type="radio" id="B442010" name="CodeSecurite" value="B44-2010"/>
            <label for="B442010">B44-2010</label>
            <input type="radio" id="ASME1712007" name="CodeSecurite" value="ASME 17.1-2007"/>
            <label for="ASME1712007">ASME 17.1-2007</label>
            <input type="radio" id="ASME1712010" name="CodeSecurite" value="ASME 17.1-2010"/>
            <label for="ASME1712010">ASME 17.1-2010</label>
        </span>
        <span class="SHR MixteRight" id="CodeSecuriteRight">
            <label for="CodeSecuriteAutre" class="SHLabel">Autre:</label>
            <input type="text" id="CodeSecuriteAutre" name="CodeSecuriteAutre"/>
        </span>
        </br></br>
        <span class="SHL">
            <label for="VilleInstallation">Ville d'installation:</label>
            <input type="text" id="VilleInstallation" name="VilleInstallation"/>
        </span>
</div>
</br>
<div id="divTypeControl">
    <h3 class="Titre">Type de contôle</h3>
        <span class="SHL">
                <label class="SHLabel">Modèle:</label>
            <input type="radio" id="JHD1000" name="JHD1000" value="JHD-1000"/>
            <label for="JHD1000">JHD-1000 (Avec automate)</label>
        </span>
        <span class="SHR">
            <input type="radio" id="JHD2000" name="JHD2000" value="JHD-2000"/>
            <label for="JHD2000">JHD-2000 (Carte de communication Canbus)</label>
        </span>
</div>
<div class="Spacers divspacer" style="height:440px;"></div>

注意:我只放了一个代码样本。我有好几次这么长的时间。<div class="Spacers divspacer" style="height:440px;"></div>是我用来尝试将所有<div id="">放在一个页面上的工具。

CSS：

<style rel="stylesheet" type="text/css">
        .Border
        {
            border: black solid 2px;
        }
        .Titre
        {
            text-align:center;
            background-color:black;
            color:white;
            border: solid black 2px;
        }
        .Spacers
        {
            display:none;
        }
    </style>

注意:我删除了不直接需要的代码，如果我删除了一些需要的东西，请说，所以我会编辑并添加缺失的代码。

菲伊:不要找.divspacer。它不存在，它只在我的JQuery中使用(见下文)。

JQUERY：

function ImprimerForm()
        {
            $("#divBgd").removeClass('Border');//This remove the border
            $("#divValidationEnvois").css('display', 'none');//This hide all the button so they dont print
            $(".divspacer").removeClass('Spacers');//Make spacers visible

            window.print();//Print form

            $("#divBgd").addClass('Border');//Put everything back has it was!!
            $("#divValidationEnvois").css('display', 'block');
            $(".divspacer").addClass('Spacers');
        }

所以我想说清楚：

问题:我不能让IE和Chrome以同样的方式打印我的表单。一些字段被切成两个，而一些<div>在两个不同的页面上。

寻找:一种让他们在浏览器上以同样的方式打印我的表单的方法，或者在布局中产生的错误。

我已经做了什么:查找window.print()的参数并尝试添加一些间隔(参见上面的代码)。

谢谢大家的帮助！

Answer 1

                stmt1="SELECT DISTINCT a.ro_code,a.ro_name,b.REGCODE,b.ROLLNUM,b.USERTYPE,b.NAME FROM regionmaster a INNER JOIN security_couser b ON TRIM`enter code here`(a.ro_code) = TRIM(b.REGCODE)  Order By b.REGCODE";
                    rs2 = st.executeQuery(stmt1);
                    out.println("<table border=1 id=cssTable><tr><td><b>Region Code</b></td><td><b>Region Name</b></td><td><b>Roll Number</b></td><td><b>Name</b></td><td><b>User Type</b></td></tr>");
                    String Countrun="";
                    while(rs2.next())
                    {
                        String reg = rs2.getString("REGCODE");
                        String regname=rs2.getString("RO_NAME");
                        String ROLLNUM= rs2.getString("ROLLNUM");
                        String USERTYPE= rs2.getString("USERTYPE");
                        String NAME= rs2.getString("NAME");
                        //Count = rs2.getString("NAME");
                        out.println("<tr><td>"+reg+"</td><td>"+regname+"</td><td>"+ROLLNUM+"</td><td>"+NAME+"</td><td>"+USERTYPE+"</td></tr>");
                    }
                    out.println("</table>");
                    rs2.close();                
           %>
                        <input id ="printbtn" type="button" value="Print" onclick="window.print();" >