小编Zen*_*cha的帖子

如何在Angular 2 Typescript中复制到剪贴板?

有没有办法在Angular2 Typescript框架中复制剪贴板(多浏览器)中的文本?

我只找到使用Javascript的来源,例如

document.execCommand('copy')
Run Code Online (Sandbox Code Playgroud)

clipboard.js angular

22
推荐指数
3
解决办法
3万
查看次数

工具提示+使用Clipboard.js突出显示动画单击

我已成功安装了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)

我应该添加什么?谢谢!

javascript clipboard.js

20
推荐指数
2
解决办法
1万
查看次数

以树格式递归列出所有目录

我想tree使用Shell脚本模拟一个命令,以这种格式递归显示所有目录:

.
|-- Lorem
|-- Lorem
|-- Lorem
    |-- Lorem
    |-- Lorem
|-- Lorem
`-- Lorem
Run Code Online (Sandbox Code Playgroud)

我怎样才能做到这一点?

shell

13
推荐指数
2
解决办法
2万
查看次数

如何在DocPad中缩小HTML,CSS和JavaScript文件?

当我点击时docpad generate,我想缩小HTML,CSS和JavaScript文件,我该怎么做?

docpad

8
推荐指数
1
解决办法
1780
查看次数

在移动设备中使用document.execCommand('copy')

有没有办法复制到移动剪贴板?我已经研究了几天但没有找到一个好的解决方案.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手机上,没有任何东西被复制.

那里有解决方案吗?

javascript clipboard.js

6
推荐指数
1
解决办法
4158
查看次数

如何使用带有动态内容和触发器的clipboard.js进行复制

点击后.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 移动到剪贴板范围.

https://jsfiddle.net/2rjbtg0c/1/

javascript clipboard jquery zeroclipboard clipboard.js

4
推荐指数
2
解决办法
8964
查看次数

有没有办法在使用mod_pagespeed在视口中显示之前延迟加载图像?

我使用了配置我.htaccess的lazyload图像mod_pagespeed,但我不希望通过显示尚未加载的图像来影响用户体验.

有没有办法在使用mod_pagespeed在视口中显示某些像素之前设置配置和延迟加载图像?

mod-pagespeed

3
推荐指数
1
解决办法
2305
查看次数