InternInhaltsverzeichnisGlossarBausteineLinklisteTutorialsKommentare

Thema: JavaScript - Die Textauswahl in Zwischenablage kopieren Artikel anzeigen

Dieter ✶✶✶✶ schrieb am Dienstag, den 15 September 2020 #1
Hallo Werner, vielen Dank für die Info. Was ist mit dynamischen Inhalten?

$text_variabel= "abcdef";
<textarea id="input"><?php echo($text_variabel); ?></textarea>

funktioniert leider nicht. Hättest Du da auch eine Lösung?
Werner schrieb am Dienstag, den 15 September 2020 #2
Lösung:
<?php
$text_variabel = "abcdef";
?>

<textarea id="input"><?=$text_variabel;?></textarea>

Wenn das ein Formular ist, dann fehlt noch das Attribut: Name, also:
name="input"
Dieter schrieb am Dienstag, den 15 September 2020 #3
Vielen Dank für die schnelle Antwort!

<?php
$text_variabel = "abcdef";
?>

<textarea id="input" name="input"><?php echo $text_variabel; ?></textarea>
<button id="copy-button" name="copy-button">Kopieren</button>

Funktioniert leider auch nicht.
<script>...</script> ist wie oben eingebunden.
Werner schrieb am Dienstag, den 15 September 2020 #4
Die Datei muss die Endung:.php haben und über dem Webserver laufen.
Mein Test: » werner-zenk.de/test/test.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
<body>

<?php
$text_variabel 
"abcdef";
?>

<textarea id="input"><?=$text_variabel?></textarea>
<button id="copy-button">Kopieren</button>

<script>
// Die Textauswahl in Zwischenablage kopieren

var input = document.getElementById("input");
var button = document.getElementById("copy-button");

button.addEventListener("click", function (event) {
 event.preventDefault();
 input.select();
 document.execCommand("copy");
});
</script>

</body>
</html>
Dieter schrieb am Mittwoch, den 16 September 2020 #5
Vielen Dank! Ja, so funktioniert es. Bei mir auch. Aber sobald $text_variabel wirklich variabel ist, funktioniert es nicht mehr.

$text_variabel = "abcdef";

for ($i=0;$i <10;$i++) {
$text_variabel .= $i;
?>

<textarea id="input"><?=$text_variabel; ?></textarea>
<button id="copy-button">Kopieren</button><br>
<?php
}
?>

Obwohl ja die Daten in <script> ankommen.
Werner schrieb am Mittwoch, den 16 September 2020 #6
Und was soll da als Ergebnis heraus kommen?
Ganz klar, eine ID darf nur einmal verwendet werden, sonst funktioniert das Script nicht!:

<textarea id="input"><?=$text_variabel; ?></textarea>
<button id="copy-button">Kopieren</button><br>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script>
function cp(ids) {
 document.getElementById(ids).select();
 document.execCommand("copy");
}
</script>

<?php
$text_variabel 
"abcdef";

for (
$i=0;$i <10;$i++) {
 
$text_variabel .= $i;
?>

<textarea id="copy<?=$i;?>"><?=$text_variabel?></textarea>
<button onClick="cp('copy<?=$i;?>')">Kopieren</button><br>
<?php
}
?>
Dieter ✶✶✶✶✶ schrieb am Mittwoch, den 16 September 2020 #7
Perfekt! Vielen Dank! Was als Ergebnis heraus kommt? Hier ist es eine dynamische Liste von URLs, die man sich dann wahlweise kopieren kann. Nochmal herzlichen Dank!
Sebastian schrieb am Sonntag, den 17 März 2024 #8
Hallo Werner,

Ich versuche mir damit gerade eine kleine Seite mit verschiedenen Textfeldern zu bauen die ich je nach Bedarf mit einem Klick in die Zwischenablage kopieren kann. Wenn ich den Code mehrfach einfüge und jedem Feld und Button eigene ID´s gebe, wird trotzdem bei jedem Button nur das gleiche Feld kopiert.. Ich habe null Ahnung von programmieren.. kannst du mir da weiterhelfen?

Beste Grüße, Sebastian
Werner schrieb am Dienstag, den 19 März 2024 #9
<script>
function cp(ids) {
document.getElementById(ids).select();
document.execCommand("copy");
}
</script>

<textarea id="copy1"> Inhalt 1</textarea>
<button onClick="cp('copy1')">Kopieren</button><br>

<textarea id="copy2"> Inhalt 2</textarea>
<button onClick="cp('copy2')">Kopieren</button><br>

<textarea id="copy3"> Inhalt 3</textarea>
<button onClick="cp('copy3')">Kopieren</button>