冻结工具提示以复制其文本 [英] Freeze hovered tooltips to copy their texts
问题描述
我正在为Fabrik（Fabrikar的Joomla扩展）编写更完整的最终用户帮助手册。我首先复制并列出后端导航树中所有设置的标签和选项。
在OS X 10.7.5上，我帮助自己禁用了Chrome（v。47）Web Developer扩展（v。0.4.6）的css。但是，我无法成功地选择在悬停时显示的大量完整文档的工具提示。
我试图将DevTools扩展设置为强制元素状态：悬停。这个想法是冻结工具提示，让我选择它的文本。但是这并没有帮助，因为工具提示过早崩溃。其实，afaik，这更多的是JavaScript的问题。
以下是代码和出现的示例。尽可能地，我宁愿在呈现的html窗口而不是代码上复制纯文本。
任何想法？
谢谢。
< div class =control-group>
< div class =control-label>
您可能希望使用GreaseMonkey - 这是一个在本地运行在页面上的Firefox扩展，并允许你（在你身边）操纵DOM。
你也可以加载jQuery，并使用一些很酷的javascript来自动执行你要做的事。
要使用它，请安装 GreaseMonkey附加组件，重新启动Firefox并导航到该页面。
然后，在工具栏上，单击GreaseMonkey按钮并选择新建用户脚本。只需将域（例如 yoursitename.com ）添加到前三个字段中，然后单击确定即可。修改脚本，使其看起来像这样： // == UserScript ==
// @name mysite .com
// @namespace mysite.com
// @description mysite.com
// @include http：//*.mysite.*/*
// @要求http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @version 1
// @grant none
// == / UserScript ==
$（function（）{
// jQuery去这里，例如：
$（'。control-label label' ）.each（function（）{
var cls = $（this）.attr（'class'）;
if（cls =='hasTooltip'）{
alert（$（this ）.attr（'data-original-title'）;
}
}）;
}）;
I am trying to prepare a more complete enduser help manual for Fabrik (Joomla extension from Fabrikar). I begin by to copy and list all the settings' labels and options on the back end navigation tree.
I helped myself disabling css with Chrome (v. 47) Web Developer extension (v. 0.4.6) on OS X 10.7.5. But I can't succeed in selecting the numerous and fully documented tooltips that show up on hovering.
I have tried to set DevTools extension to "Force element state :hover". The idea was to freeze the tooltip allowing me to select its text. But this doesn't help because the tooltip collapses too soon. Actually, afaik, it is more a matter of javascript.
Here is an example of code and appearence. As much as possible, I would prefer to copy plain text on the rendered html window rather than the code.
Any idea?
Thank you.
<div class="control-group">
<div class="control-label">
<label id="jform_params_list_detail_link_target-lbl"
for="jform_params_list_detail_link_target" class="hasTooltip" title=""
data-original-title="<strong>Detail Link Target</strong><br />
Target for detail view link, default to opening in the same tab (_self).
Ignored if AJAX-ified links." aria-invalid="false">
Detail Link Target</label> </div>
<div class="controls">
<select id="jform_params_list_detail_link_target" name="jform[params]
[list_detail_link_target]" size="4" aria-invalid="false">
<option value="_self">Self</option>
<option value="_blank">Blank (new tab / window)</option>
<option value="_parent">Parent</option>
<option value="_top">Top</option>
</select>
</div>
</div>
Screen capture with tooltip display
You might wish to use GreaseMonkey -- it's a Firefox extension that runs on the page locally, and allows you (on your side) to manipulate the DOM.
You can also load jQuery with it, and use some pretty cool javascript to automate what you are trying to do.
To use it, install the GreaseMonkey add-on, restart Firefox, and navigate to the page.
Then, on the toolbar, click the GreaseMonkey button and choose New User Script. Just add the domain (e.g. yoursitename.com)to the top three fields, and click OK.
Next, modify the script so it looks something like this:
// ==UserScript==
// @name mysite.com
// @namespace mysite.com
// @description mysite.com
// @include http://*.mysite.*/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @version 1
// @grant none
// ==/UserScript==
$(function(){
//jQuery goes here, for example:
$('.control-label label').each(function(){
var cls = $(this).attr('class');
if (cls=='hasTooltip'){
alert( $(this).attr('data-original-title');
}
});
});
这篇关于冻结工具提示以复制其文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
