Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Оповещение о копировании текста (https://javascript.ru/forum/dom-window/85679-opoveshhenie-o-kopirovanii-teksta.html)

Barsssik 24.12.2023 22:08

Оповещение о копировании текста
 
Всем привет.

Есть рабочий код, который копирует текст в буфер обмена по клику мышью. Но оповещение о том, что текст скопирован выводится с помощью alert, что меня категорически не устраивает. Не подскажите, как вывести оповещение в виде обычного сообщения, которое само удалится через несколько секунд и/или после нажатия на крестик?

Прошу строго не судить, в JS я полный ноль...

<span class="copy-code" id="text">SALE25</span>

<script>
jQuery(document).ready(function($){
$('.copy-code').click(function() {
var $text_copy = $(this);
var $temp = $("<input>");
$("body").append($temp);
$temp.val($text_copy.text()).select();
document.execCommand("copy");
alert("Промокод скопирован");
$temp.remove();
$('.copy_link_mess').fadeIn(400);
setTimeout(function(){$('.copy_link_mess').fadeOut(400);},5000);
});
});
</script>

ksa 25.12.2023 12:26

Цитата:

Сообщение от Barsssik
как вывести оповещение в виде обычного сообщения, которое само удалится через несколько секунд и/или после нажатия на крестик?

Например так...

<dialog>
	<p>Промокод скопирован</p>
	<button>X</button>
</dialog>


<script>
const o = document.querySelector('dialog')
o.showModal()
const t = setTimeout(_ => o.close(), 2000)
o.querySelector('button').addEventListener('click', _ => {
	if (t) clearTimeout(t)
	o.close()
})
</script>


Часовой пояс GMT +3, время: 03:18.