打印时隐藏JQueryUI工具提示

Question

我在我的应用程序中的几个组件上使用JQueryUI工具提示，它们运行良好。然而，当他们在Chrome移动浏览器中点击时，他们会在组件上徘徊 - 我真的很喜欢这个功能 - 但是如果我在显示时打印，工具提示也会打印出来。

我尝试添加

@media print
{
   .ui-tooltip
    {
        display: none;
    }
}

到我的样式表，但没有成功，虽然我可以使用该选择器来设置工具提示的其他方面，如颜色和字体。

Answer 1

Jquery UI Tooltip在插入dom时向元素添加display: block;，内联样式只能用!important覆盖，这是不好的做法，可以通过visibility: hidden; <来避免/ p>

@media print
{
   .ui-tooltip
    {
        visibility: hidden;
    }
}

通常，这将是一个问题，因为visibility: hidden;允许隐藏元素占用空间。但是因为工具提示的性质绝对定位，所以不会成为问题。

Answer 2

仅隐藏 .ui-tooltip 是不够的。我不得不隐藏 .ui-helper-hidden-accessible 。