JQuery Kopieren Sie Text & Paste in TextArea

Question

Ich habe eine JavaScript-Funktion erstellt, die eine versteckte Spannweite, kopieren Sie den Text innerhalb dieser Zeitspanne und fügen Sie es in ein einzelnes TextArea-Tag auf einer Website ein. Ich habe eine Funktion in JavaScript geschrieben, die das tut (gut, irgendwie, nur nach ein paar Klicks), aber ich weiß, dass es einen besseren Weg gibt - irgendwelche Gedanken? Das Verhalten ähnelt einem Retweet für Twitter, verwendet aber stattdessen Abschnitte eines Posts in einem Blog. Oh, und ich rufe auch zu jquery im Header.

<script type="text/javascript"> 
function repost_submit(postID) {  
    $("#repost-" + postID).click(function(){ 
     $("#cat_post_box").empty(); 
     var str = $("span#repost_msg-" + postID).text(); 
     $("#cat_post_box").text(str); 
    }); 
} 
</script> 

Answer 1

$("#repost-" + postID).click(function(){ 
    $("#cat_post_box").val(''); // Instead of empty() - because empty remove all children from a element. 
    $("#cat_post_box").text($("#repost_msg-" + postID).text());//span isn't required because you have and id. so the selector is as efficient as it can be. 
}); 

und wickeln alles in einem $ (document) .ready (function() {/ geben Sie den Code hier /}), so dass es zu $ ​​binden ("# repost-" + postID) Taste oder verknüpfen, wenn das DOM geladen ist.

Answer 2

Basierend auf dem Kommentar in Ihrer Frage, ich gehe davon aus Sie so etwas wie dies in Ihrem HTML haben:

<a href="#" onclick="repost_submit(5);">copy post</a> 

Und ich bin auch davon aus, dass, weil Sie eine Post-ID sind vorbei kann es mehr als eins pro Seite.

Ein Teil der Schönheit von jQuery ist, dass Sie wirklich coole Sachen zu Gruppen von Elementen machen können, ohne Javascript-Inline-Ereignisse verwenden zu müssen. Diese werden heute als eine schlechte Praxis angesehen, da es am besten ist, Javascript von Ihrem Präsentationscode zu trennen.

Der richtige Weg, dann wäre, so etwas wie dies zu tun:

<a href="#" id='copy-5' class='copy_link'>copy post</a> 

Und dann können Sie viele mehr haben, die ähnlich aussehen:

<a href="#" id='copy-5' class='copy_link'>copy post</a> 
<a href="#" id='copy-6' class='copy_link'>copy post</a> 
<a href="#" id='copy-7' class='copy_link'>copy post</a> 

Schließlich Sie Code schreiben können jQuery, so etwas zu tun:

$(function() { // wait for the DOM to be ready 
    $('a.copy_link').click(function() { // whenever a copy link is clicked... 
     var id = this.id.split('-').pop(); // get the id of the post 
     var str = $('#repost_msg-' + id); // span not required, since it is an ID lookup 
     $('#cat_post_box').val(str); // empty not required, and val() is the proper way to change the value of an input element (even textareas) 
     return false; 
    }); 
}); 

Dies ist der beste Weg, es zu tun, auch wenn es nur einen Beitrag gibt Die Seite. Ein Teil des Problems mit Ihrem Code ist, dass beim ersten Klick die Funktion BINDEN wird, und bei den nachfolgenden Klicks, wenn sie schließlich aufgerufen wird. Sie könnten für eine schnelle und schmutzige Reparatur gehen, indem Sie das ändern, um nur in document.ready zu sein.

Answer 3

Ich hatte ein Problem mit Paolos Beispiel, als ich auf den Link klickte, der Text in #cat_post_box war "object Object". Sobald ich ".text()" am Ende dieser Aussage hinzugefügt habe, habe ich gearbeitet.

var str = $('#repost_msg-' + id).text(); 

Vielen Dank für Ihr Beispiel Paolo!