0

我想在链接之前获取 < p > 的内容：

<p class="copiedText">aaa</p>
<a class="copy-btn" href="#">a copy button</a><br /><br />

<p class="copiedText">ccc</p>
<a class="copy-btn" href="#">a copy button</a><br /><br />

并使用zClip将其复制到剪贴板。

我让它使用这个 JQuery 片段为单个链接工作：

$(document).ready(function(){
    $('a.copy-btn').zclip({     
        path:'js/ZeroClipboard.swf',
        copy:$('p.copiedText').text(),
    });
});

但是当有多个按钮/链接时，所有<p>的内容都会被一次复制。我正在尝试这样实现.prev()运算符：

copy:$('p').prev('.copiedText').text()

但无济于事。我已经以很多不同的方式实现 prev() 但没有结果。

我是否误解了 prev 的工作原理？还是我只是搞砸了实施？

（我会链接到它的 jsfiddle，但点击复制功能在那里不起作用）

[编辑：身份证到班级，呜呜呜]

4

4 回答 4

2

首先，每个文档的 ID 应该是唯一的。将 id 替换为 class 并选择.copiedText而不是#copiedText

您要做的第二件事是将点击处理程序附加到 all .copy-btn：

$(".copy-btn").click(function(){
    $(this).zclip({     
        path:'js/ZeroClipboard.swf',
        copy:$(this).prev('p.copiedText').text(),
    }); 
})

继承人编辑的HTML：

<p class="copiedText">aaa</p>
<a class="copy-btn" href="#">a copy button</a><br /><br />

<p class="copiedText">ccc</p>
<a class="copy-btn" href="#">a copy button</a><br /><br />

回复：

.click 是一个事件，.zclip 是一个方法。您应该在事件处理程序中实现方法调用：

$(".copy-btn").click(function(){
    $(this).zclip({     
        path:'js/ZeroClipboard.swf',
        copy:$(this).prev('p.copiedText').text(),
    });
});
于 2012-05-16T21:07:28.917 回答
1

看起来您正在创建重复的 id 尝试使用类。ID 在页面上必须是唯一的。

于 2012-05-16T21:06:22.257 回答
1

查看他们的文档，有一个复制功能的回调。这是您应该用来获取动态副本值的方法：

$(".copy-btn").zclip({
    path: 'js/ZeroClipboard.swf',
    copy: function(){
        // `this` should be the current a.copy-btn
        return $(this).prev('p.copiedText').text();
    }
});

Dimitri 的答案可能无法正常工作，因为 zclip 绑定了目标上的事件。因此，在事件回调中绑定其他事件将 a）第一次单击不起作用，并且 b）可能绑定多次。对于这种方法，请使用 aeach而不是 a click。

于 2012-06-05T16:00:25.413 回答
1

这是你要找的吗？

$('.copy-btn').click(function(){
    some_text = $(this).prev('p').text();
    console.log(some_text);
});​

jsfiddle 示例：http: //jsfiddle.net/bradleygriffith/KhuAS/

于 2012-05-16T23:21:31.593 回答