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にリンクしますが、クリックしてコピーする機能はそこで機能していません）

[編集：IDからクラス、ウープ]]

4

4 に答える 4

2

まず、IDはドキュメントごとに一意である必要があります。idをclassに置き換え、.copiedText代わりにselectを使用します#copiedText

次に実行したいのは、クリックハンドラーをすべてにアタッチすることです.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').click(function(){
    some_text = $(this).prev('p').text();
    console.log(some_text);
});​

jsfiddleの例：http ：//jsfiddle.net/bradleygriffith/KhuAS/

于 2012-05-16T23:21:31.593 に答える
1

彼らのドキュメントを見ると、コピー関数のコールバックがあります。これは、動的コピー値を取得するために使用する必要があるものです。

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

zclipがターゲット上のイベントをバインドするため、Dimitriの回答が正しく機能しない場合があります。したがって、イベントコールバックで追加のイベントをバインドすると、a）最初のクリックが機能せず、b）複数回バインドされる可能性があります。そのアプローチでは、のeach代わりにを使用しclickます。

于 2012-06-05T16:00:25.413 に答える