有没有办法在Angular2 Typescript框架中复制剪贴板(多浏览器)中的文本?
我只找到使用Javascript的来源,例如
document.execCommand('copy')
Run Code Online (Sandbox Code Playgroud) 我已成功安装了clipboard.js,并在点击后获得了要复制到剪贴板的文本片段.我将把这些文本片段(或者它们所在的"btn")嵌入到表格的单元格中.
我的挑战:
我需要文本片段给我一个工具提示"复制!" 消息,以便人们知道它们是可点击的.一个很好的例子是在clipboard.js文档页面上 - 单击任何剪切或复制的按钮以查看工具提示消息.
来自clipboard.js的文档:
虽然Safari尚不支持使用execCommand执行复制/剪切操作(包括移动设备),但由于支持选择,因此优雅地降级.
这意味着你可以显示一个工具提示说复制!调用成功事件时按Ctrl + C复制调用错误事件,因为文本已被选中.
我不是特别擅长JS(我花了几个小时才能做到这一点).所以我处于死胡同......能够在WP上安装所有内容,将脚本排队,并添加文本/功能:
<!-- 1. Define some markup -->
<div id="btn" data-clipboard-text="1">
<span>text to click</span>
</div>
<!-- 2. Include library -->
<script src="/path/to/dist/clipboard.min.js"></script>
<!-- 3. Instantiate clipboard by passing a HTML element -->
<script>
var btn = document.getElementById('btn');
var clipboard = new Clipboard(btn);
clipboard.on('success', function(e) {
console.log(e);
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
});
clipboard.on('error', function(e) {
console.log(e);
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});
</script>
Run Code Online (Sandbox Code Playgroud)
我应该添加什么?谢谢!
我想tree使用Shell脚本模拟一个命令,以这种格式递归显示所有目录:
.
|-- Lorem
|-- Lorem
|-- Lorem
|-- Lorem
|-- Lorem
|-- Lorem
`-- Lorem
Run Code Online (Sandbox Code Playgroud)
我怎样才能做到这一点?
当我点击时docpad generate,我想缩小HTML,CSS和JavaScript文件,我该怎么做?
有没有办法复制到移动剪贴板?我已经研究了几天但没有找到一个好的解决方案.Clipboard.js似乎不适用于移动设备,给我一个错误"没有支持:("
我目前正在使用以下功能:
function copytext(text) {
var textField = document.createElement('textarea');
textField.innerText = text;
document.body.appendChild(textField);
textField.select();
document.execCommand('copy');
textField.remove();
}
Run Code Online (Sandbox Code Playgroud)
在我的桌面上像chrome上的魅力一样工作.但在Chrome手机上,没有任何东西被复制.
那里有解决方案吗?
点击后.fw-code-copy-button我想从它最近的容器中复制源代码.
.fw-code-copy-button用户单击专用的"查看源"按钮后动态创建-s.
例如Html按钮:
<span class="fw-code-copy">
<span class="fw-code-copy-button" data-clipboard-text="...">copy</span>
</span>
Run Code Online (Sandbox Code Playgroud)
这是我触发click事件的方法,并定义要复制到剪贴板的源代码:
$(document).on("click", ".fw-code-copy-button", function(){
var source = $(this).closest(".fw-code-copy").next("code").text();
});
Run Code Online (Sandbox Code Playgroud)
这就是clipboard.js触发它的复制事件的方式
new Clipboard(".fw-code-copy-button", {
text: function(trigger) {
return source; // source should somehow be copied from scope above it
}
});
Run Code Online (Sandbox Code Playgroud)
每当我点击网站上的任何地方时,都会出现以下错误:
Uncaught Error: Missing required attributes, use either "target" or "text"
Run Code Online (Sandbox Code Playgroud)
但首先,我不想定义要复制的文本data-clipboard-text="..."
,其次data-clipboard-text是使用"..."它的值来定义.
如果有人愿意支付一秒钟,我将非常感激.
[编辑]我已经编写了jsFiddle用于演示,并且令人惊讶的是UncaughtError消失了,但我仍然需要将source代码从onClick 移动到剪贴板范围.
我使用了配置我.htaccess的lazyload图像mod_pagespeed,但我不希望通过显示尚未加载的图像来影响用户体验.
有没有办法在使用mod_pagespeed在视口中显示某些像素之前设置配置和延迟加载图像?