1

我有一个表格，最初在列中隐藏了一些（历史）数据。当我打印表格时，会打印隐藏的数据。这很好。当我单击show-history历史列中的链接时，表格会展开并显示隐藏的数据。如果我然后打印这个视图，我会得到隐藏的数据。这也是需要的。但是，当我单击hide-history链接然后打印时，我没有得到隐藏的数据。不是很好！

这是我的 showHide javascript

function showHide(shID) {
if (document.getElementById(shID)) {
  if (document.getElementById(shID+'-show').style.display != 'none') {
     document.getElementById(shID+'-show').style.display = 'none';
     document.getElementById(shID).style.display = 'block';
  }
  else {
     document.getElementById(shID+'-show').style.display = 'inline';
     document.getElementById(shID).style.display = 'none';
  }
}
}

在我的jsp中：

 <a href="#" id="cID${comment.comment_id}-show" class="showLink" onclick="showHide('cID${comment.comment_id}');return false;">show history</a>

<TBODY id="cID${comment.comment_id}" class="more">
 .... hidden content
 <a href="#" id="cID${comment.comment_id}-hide" class="hideLink" onclick="showHide('cID${comment.comment_id}');return false;">hide history</a>
 </TBODY>

样式屏幕.css

.more {
  display: none;
}

StylePrint.css（尝试设置 TBODY 样式的此尝试和其他尝试均无效）

.more {
  display: block;
}
4

2 回答 2

1

您的 JavaScript 将以内联方式设置（隐藏/显示）元素的样式。拥有两个带有media="screen"and的 css 文件media="print"将不起作用。

您需要（在“屏幕”CSS 中）：

.more {
    display: none;
}

.more.show {
    display: block;
}

...并使用 JS，改为更改元素的类（添加/删除“显示”）。

于 2013-01-31T17:43:14.130 回答
1

由于您将.more's inline-style 更改为display:none然后该样式胜过StylePrint.css. 这意味着，您不能使用StylePrint.css.

修理：

.more尝试从with中删除内联样式document.getElementById(shID).style.display = '';。

这应该默认.more返回状态，并允许您在打印模式下hidden覆盖隐藏状态。StylePrint.css

于 2013-01-31T22:26:10.750 回答