Question

我正在尝试使用Knockoutjs创建一个动态加载文本的网站，我希望用户能够点击并将其复制到剪贴板。对于复制到剪贴板功能，我正在使用Zclip，当文本静态加载时，我可以使用它。

在我的ViewModel中，我有一个函数copyFunction，如下所示：

self.copyFunction = function(html) {
    console.log(html);
    $('#copytext').zclip({
        path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
        copy: function() {
            return $('#copytext').text();
        }
    });
}

只要在网页上点击其中一个项目，就会调用此方法。

在我的HTML中，我为每个项目动态生成了这种内容：

<div class="row" data-bind="foreach: itemList">
        <div class="col-xs-3 text-center">
            <a data-bind="click: $parent.copyFunction, text: text" href="#" id="copytext"></a>
        </div>
</div>

我知道我的copyFunction不正确，但我不知道我需要做些什么来让它为我工作。理想情况下，我想将ZClip应用于调用它的<a>标记，但我不知道如何实现此目的。

我之前使用ZClip的唯一方法是最着名的例子：在HTML中设置id并使用jQuery事件处理程序。但是，我不能让它工作，因为我是JS的新手，我很确定在我的jQuery函数时id没有完全加载，因此它没有正确链接到DOM

如果你能帮助我深入了解如何让这项工作得以实现，我将非常感激。

Answer 1

通过将event作为参数传递给函数解决了我的问题。

以下是该功能现在的样子：

self.copyFunction = function(html, event) {
    var target = event.target;
    $(target).zclip({
        path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
        copy: function() {
            return $(target).text();    
        }
    });
}

我有一个额外的怪癖是Zclip仅在我将网站上传到我的服务器时才有效，但不能从我的本地主机上传。有没有人知道为什么会发生这种情况？

试图在Knockout中使用ZClip

1 个答案: