使用javascript在IE 11中打印计算表（交互式表单）

我有不同的交互表单，我正在寻找一个纯JavaScript解决方案，在点击时打印页面的一部分。因此，每页都会有一个“点击打印”按钮，它会打开一个新的页面准备打印。我尝试了许多解决方案，其中一些效果很好，但在IE11中除外

我的一些表单很复杂，但为了保持简单，下面是我尝试使用的代码的一个简单示例：

<div id='DivIdToPrint'>
<p>This is a sample text for printing purpose.</p>

  First name: <input type="text" name="firstname" value=""><br>
  Last name: <input type="text" name="lastname" value=""><br><br>
  Gender: <br />
  <input type="radio" name="gender" value="male"> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other<br><br>
  </div> 

这是用于打印的示例文本

名字：

姓氏：


性别：

男性

女性

其他

函数printDiv（）{
var divToPrint=document.getElementById（'DivIdToPrint'）.innerHTML；
var newWin=window.open（）；
newWin.document.write（divToPrint）；
newWin.print（）；
newWin.close（）；
}

两个问题： 1.我无法打印和打印每个表单项的值 2.此解决方案在IE11中不起作用

有人能帮忙吗

填充表单不会修改html标记，也不会更改实际标记中的

值

属性。因此，无法使用

.innerHTML

获取值。如果希望html具有新值，只需将属性设置为新值

为了确保脚本的输出实际显示在另一个窗口中，我们应该在编写内容后使用

document.close（）

您可以查看我的演示，它可以在IE和其他broswers中很好地工作：

<div id='DivIdToPrint'>
    <p>This is a sample text for printing purpose.</p>
    First name: <input type="text" name="firstname" value=""><br>
    Last name: <input type="text" name="lastname" value=""><br><br>
    Gender: <br />
    <input type="radio" name="gender" value="male"> Male<br>
    <input type="radio" name="gender" value="female"> Female<br>
    <input type="radio" name="gender" value="other"> Other<br><br>
    <input type="radio" name="aa" value="a"> A<br>
    <input type="radio" name="aa" value="b"> B<br>
    <input type="radio" name="aa" value="c"> C<br><br>
</div>
<input type='button' id='btn' value='Print' onclick='printDiv();'>

<script type="text/javascript">
    function printDiv() {
        //Set attribute to new value
        var inputs, index;
        inputs = document.getElementsByTagName('input');
        for (index = 0; index < inputs.length - 1; ++index) {
            var fieldValue = inputs[index].value;
            inputs[index].setAttribute('value', fieldValue);               
        }
        var radios, i;
        radios = document.querySelectorAll('input[type="radio"]:checked');
        for (i = 0; i < radios.length; i++) {
            radios[i].setAttribute('checked', true);
        }
        var divToPrint = document.getElementById('DivIdToPrint').innerHTML;
        var newWin = window.open();
        newWin.document.write(divToPrint);
        newWin.document.close(); //Close after writing content
        newWin.focus();
        newWin.print();
        newWin.close();
    }
</script>

这是用于打印的示例文本

名字：

姓氏：


性别：

男性

女性

其他


A

B

C


函数printDiv（）{
//将属性设置为新值
var输入，指数；
输入=document.getElementsByTagName（'input'）；
对于（索引=0；索引

谢谢您的回复。我测试了你的代码，它可以在不同的浏览器中工作，但由于某些原因，它不能在IE11中工作。当我点击打印时，它实际上打开了一个Windows资源管理器。还有一件事有没有办法让javascript动态设置所有表单项的值，而不是手动修改每个表单的javascript？我有1000多个表单（其中大多数非常不同）…目前我别无选择，只能使用IE 11。我修改了我的代码，该函数可以使用

for

循环动态设置值。如果您有其他类型的

输入

，只需像代码一样为循环添加其他

。我对“不在IE11工作”有点困惑。当我在我身边测试时，它实际上会打开一个新页面和一个打印对话框。我在Windows10上使用的是11.116.18362.0。您可以将IE 11更新为最新版本，然后重试。谢谢您的帮助。现在好像开始工作了。干杯！您可以将答案标记为已接受，或者发布您自己的解决方案并将其标记为已接受答案。它可以在将来帮助其他社区成员解决类似的问题。感谢您的理解。我确实将您的答案标记为已接受的解决方案，但收到此消息“记录声誉低于15的人所投的票，但不要更改公开显示的帖子分数”。再次感谢您的帮助！
<div id='DivIdToPrint'>
    <p>This is a sample text for printing purpose.</p>
    First name: <input type="text" name="firstname" value=""><br>
    Last name: <input type="text" name="lastname" value=""><br><br>
    Gender: <br />
    <input type="radio" name="gender" value="male"> Male<br>
    <input type="radio" name="gender" value="female"> Female<br>
    <input type="radio" name="gender" value="other"> Other<br><br>
    <input type="radio" name="aa" value="a"> A<br>
    <input type="radio" name="aa" value="b"> B<br>
    <input type="radio" name="aa" value="c"> C<br><br>
</div>
<input type='button' id='btn' value='Print' onclick='printDiv();'>

<script type="text/javascript">
    function printDiv() {
        //Set attribute to new value
        var inputs, index;
        inputs = document.getElementsByTagName('input');
        for (index = 0; index < inputs.length - 1; ++index) {
            var fieldValue = inputs[index].value;
            inputs[index].setAttribute('value', fieldValue);               
        }
        var radios, i;
        radios = document.querySelectorAll('input[type="radio"]:checked');
        for (i = 0; i < radios.length; i++) {
            radios[i].setAttribute('checked', true);
        }
        var divToPrint = document.getElementById('DivIdToPrint').innerHTML;
        var newWin = window.open();
        newWin.document.write(divToPrint);
        newWin.document.close(); //Close after writing content
        newWin.focus();
        newWin.print();
        newWin.close();
    }
</script>