• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Kopiowanie tekstu do schowka

Aruba Cloud - Virtual Private Server VPS
0 głosów
2,096 wizyt
pytanie zadane 23 maja 2020 w JavaScript przez Bakkit Dyskutant (7,600 p.)
zamknięte 23 maja 2020 przez Bakkit
Witam,

chciałbym aby na mojej stronie po kliknięciu w diva automatycznie kopiował się pewien tekst do schowka, tak aby potem można było go wkleić w wyszukiwarkę za pomocą ctrl+v. Jak można takie coś zrobić?

Pozdrawiam.
komentarz zamknięcia: Rozwiązanie problemu.

2 odpowiedzi

+2 głosów
odpowiedź 23 maja 2020 przez ScriptyChris Mędrzec (190,190 p.)
wybrane 23 maja 2020 przez Bakkit
 
Najlepsza

Dane do schowka możesz skopiować za pomocą Clipboard API lub starszej alternatywy Document.execCommand() - zależy jakie przeglądarki wspierasz.

komentarz 23 maja 2020 przez Bakkit Dyskutant (7,600 p.)
Dzięki, możesz podać przykład jak użyć Document.execCommand() ? Już chwilę próbuje i mi nie chce zadziałać.
komentarz 23 maja 2020 przez ScriptyChris Mędrzec (190,190 p.)
Pokaż jak próbujesz tego użyć. Są jakieś błędy w konsoli?
komentarz 23 maja 2020 przez Bakkit Dyskutant (7,600 p.)

Kod:

var div = document.querySelector('.contactEmail');

div.addEventListener("click", function() {
    div.execCommand("copy", Boolean, "tekst");
});

Błąd:

copy.js:3 Uncaught TypeError: Cannot read property 'addEventListener' of null
    at copy.js:3

komentarz 23 maja 2020 przez ScriptyChris Mędrzec (190,190 p.)

Na początku uporaj się z brakiem referencji <div>a. :) Upewnij się, że selector .contactEmail jest prawidłowy. Jeśli tak, to możliwe że podpinasz skrypt przed elementem w kodzie HTML (a skrypt powinieneś podpiąć po elemencie lub najlepiej przed zamykającym znacznikiem </body>).

Co do użycia execCommand, to nie jest to metoda należąca do zmiennej div ani też do jej prototypu - należy do obiektu document. Użycie drugiego i trzeciego parametru (Boolean i "tekst") w tym przypadku jest zbędne. Kopiowanie opiera się o zaznaczony tekst na stronie. Możesz to zrobić samemu (myszką/klawiaturą) i wtedy odpalić komendę document.execCommand('copy'), ale to na dłuższą metę jest mało automatyczne. :) Z pomocą przychodzi metoda selectAllChildren obiektu Selection, do której przekazujesz selector elementów do zaznaczenia.

Całość możesz zapisać w ten sposób:

<div id="exampleText">Testowy tekst do skopiowania.</div>
const elementToCopy = document.getElementById('exampleText');

window.getSelection().selectAllChildren(elementToCopy);
document.execCommand('copy');

 

+1 głos
odpowiedź 23 maja 2020 przez DawidK Nałogowiec (37,910 p.)
komentarz 23 maja 2020 przez Bakkit Dyskutant (7,600 p.)
To jest pobieranie z inputa, a ja szukam czegoś co pobierze tekst, który ustawie sobie w kodzie js.
komentarz 23 maja 2020 przez DawidK Nałogowiec (37,910 p.)
inputa z wpisanym na stałe tekstem można sobie ukryć
komentarz 23 maja 2020 przez Bakkit Dyskutant (7,600 p.)
Też o tym pomyślałem, ale jeśli można stworzyć coś z bez takiego kombinowania (w czystym kodzie js), to chciałbym tego użyć.
komentarz 23 maja 2020 przez DawidK Nałogowiec (37,910 p.)
To co przychodzi mi jeszcze do głowy to utworzenie inputa (dodanie do DOM), ustawienie tekstu, skopiowanie do schowka za pomocą select() i usunięcie inputa z DOM

Podobne pytania

+1 głos
1 odpowiedź 415 wizyt
0 głosów
1 odpowiedź 1,181 wizyt
pytanie zadane 29 października 2018 w JavaScript przez blua24 Nowicjusz (140 p.)
0 głosów
1 odpowiedź 838 wizyt
pytanie zadane 26 lipca 2018 w JavaScript przez embid123 Użytkownik (630 p.)

93,326 zapytań

142,323 odpowiedzi

322,390 komentarzy

62,654 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...