使用 html 悬停代码选项在/隐藏下打印数据答案

【问题标题】：printing data under / hidden with html hover code option使用 html 悬停代码选项在/隐藏下打印数据
【发布时间】：2016-11-17 15:32:07
【问题描述】：

如何打印网页上需要您将鼠标悬停在其上才能查看的数字，就像在更好的商业网站上找到的数字一样。

示例： http://www.bbb.org/raleigh-durham/accredited-business-directory/roofers

我访问了网站，但必须将鼠标悬停在电话图标上才能查看电话号码。如何使这些电话号码一次全部可见，以便我可以将它们全部打印在一个文档上？

谢谢

【问题讨论】：

虽然这对我来说似乎不是与编程相关的问题，但您可以进入浏览器的开发者控制台并输入：jQuery('[itemprop="phone"]').parent('div').show();。

标签： javascript html css web printing

【解决方案1】：

不完全是 stackoverflow 问题，但这是解决方案，将这一行复制并粘贴到 URL 在页面加载后：

javascript:jQuery('.phone-link div:first-child').hide();jQuery('.phone-link div:last-child').show()

（包括开头的javascript:）。

注意 - 您需要将当前网址 (www.bbb...)替换为上面代码块中的网址。

【讨论】：

谢谢我试过 www.bbb.org/raleigh-durham/accredited-business-directory/roofers?javascript:jQuery('.phone-link div:first-child').hide(); jQuery('.phone-link div:last-child').show() 但我仍然需要将鼠标悬停在电话链接上才能查看它。如果这个问题不属于这里，应该在哪里发布？
no no :) 加载原始页面后 - 用我给你的 URL 替换 URL。

【解决方案2】：

<div data-num="123456" class="phone">phone<div>
<script>
$(".phone").on('mouseover',function(){
    $(this).html($(this).attr("data-num"));
});
$(".phone").on('mouseout',function(){
    $(this).html("phone");
});
</script>

【讨论】：

欢迎来到 Stack Overflow！虽然这段代码 sn-p 可以解决问题，包括解释 really helps 以提高您的帖子质量。请记住，您正在为将来的读者回答问题，而不仅仅是现在提问的人！请edit您的答案添加解释，并说明适用的限制和假设。