Скопируйте текстовый текст в буфер обмена HTML / Javascript - PullRequest
Новая
       31

Скопируйте текстовый текст в буфер обмена HTML / Javascript

1 голос
/ 18 сентября 2010

эй, я знаю, что есть много учебных пособий, но ни одна из них, похоже, не работает для меня.

У меня есть это: 

<textarea name="forum_link" type="text" style="width:630px; height:90px;">
[URL=http://www.site.net/video/<?=$_GET['id']?>/<?=$_GET['tag']?>]<?=$video->title?>[/URL]

[URL=http://www.site.net/video/<?=$_GET['id']?>/<?=$_GET['tag']?>][IMG]<?=$video->thumbnailURL?>[/IMG][/URL]
</textarea>

Теперь все, что я хочу, это простая кнопка, которая при нажатии копирует текст в текстовой области в буфер обмена пользователя.

Любая помощь будет великолепна:)

Спасибо

Ответы [ 6 ]

3 голосов
/ 22 апреля 2016 
<textarea id="html" name="html">Some text</textarea>
<input type="button" value="Refresh" onclick="copy_to_clipboard('html');">

<script>
function copy_to_clipboard(id)
{
    document.getElementById('html').select();
    document.execCommand('copy');
}
</script>
2 голосов
/ 18 сентября 2010

К сожалению, нет единого решения для этого. Браузеры, кроме IE, не позволяют копировать в буфер обмена. Недавно я нашел хорошее решение, которое использует Flash (для всех браузеров, кроме IE) и JavaScript для IE для копирования текста в буфер обмена. Подробнее см. zeroclipboard .

1 голос
/ 18 сентября 2010

Проверьте эту страницу. Это ничего не говорит о совместимости браузера, но может стоить проверить! Он дает копию javascript в пример буфера обмена и связанный с ним HTML.

http://www.geekpedia.com/tutorial126_Clipboard-cut-copy-and-paste-with-JavaScript.html

0 голосов
/ 22 сентября 2015

Решение чисто на Javascript. я не знаю о его совместимости с другими браузерами. Чтобы Chrome работал, я добавляю фрагмент кода. 

//all text written(inside text area), is copied and shown inside the div with class "mas"
//you can't see it, as it is hidden(opacity is 0)

$('#content:not(.focus)').keyup(function(){					
								
								
    var value = $(this).val();
    var contentAttr = $(this).attr('name');
    
    $('.'+contentAttr+'').html(value.replace(/\r?\n/g,'<br/>'));
    
})

//below code can copy text inside a div. div id should be identical with button oclick id  

copyToClipboard = function (element) {
    var $temp = $("<input />");
    $("body").append($temp);
    $temp.val($(element).text()).select();

    var result = false;
    try {
        result = document.execCommand("copy");
    } catch (err) {
        console.log("Copy error: " + err);
    }

    $temp.remove();
    return result;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<textarea name="mas" rows="6" id="content"></textarea>
<p>&nbsp;</p>
<div id="p1" class="mas" style="top:0px;position:absolute;opacity:0;" ></div>

<button onclick="copyToClipboard('#p1')">Copy P1</button>

Пожалуйста, смотрите это Jsfiddle для более подробной информации.

0 голосов
/ 04 сентября 2015

К сожалению, JavaScript не имеет универсального способа. В настоящее время использование flash & javascript наиболее универсальным способом. Посмотрите на LMCButton - небольшую анимированную кнопку вспышки (4 КБ) для «Копировать в буфер».

Пример использования JavaScript:

Получить HTML-код кнопки: функция lmc_get_button (cliptext, idLMC)

Обновить текст в кнопке: функция lmc_set_text (idLMC, текст)

0 голосов
/ 18 сентября 2010

Совместимость браузера с любым скриптом в лучшем случае плохая. JavaScript намеренно не позволяет этот уровень функциональности с операционной системой. Можно создать подписанный скрипт, с которым вам повезет больше, но ... это намного больше работы и вряд ли стоит того. Большинство людей умеют копировать и вставлять ...

...