2011-12-14 3 views
1

Я разрабатываю инструменты для веб-разработки, и я хотел бы скопировать часть HTML-кода текущей веб-страницы в буфер обмена, используя Javascript.Скопируйте фрагмент HTML страницы в буфер обмена

Это, вероятно, будет связано с

  • Получение кусок HTML в вопросе с помощью DOM innerHTML

  • Копирование этого текста в буфер обмена с помощью Javascript

Кто-нибудь известно о какой-либо Получилось? Например. связанные с обработкой буфера обмена - когда не используется режим documentEditable, мне нужно создать скрытое место для размещения полезной нагрузки HTML для копирования?

Также, если возможно, я хотел бы, чтобы взаимодействие с компонентами WYSIWYG, например TinyMCE, работало так, чтобы при вставке HTML в визуальный режим редактирования он проходил как форматированный HTML вместо обычного текста.

Достаточно, если решение работает в Chrome и Firefox. Internet Explorer не нуждается в поддержке.

ответ

1

Javascript не имеет возможности добавлять вещи в буфер обмена. Ну, по крайней мере, не все, что работает в браузере.

Однако есть вспышка, которая работает хорошо. http://code.google.com/p/zeroclipboard/

+0

Google Docs делает пользовательское действие Copy в меню правой кнопкой мыши. Я был бы доволен решением FF + Chrome и забыл IE. Это для веб-разработчиков, поэтому мне не нужно обслуживать пользователей IE. –

+0

+1 у javascript действительно нет способа добавить вещи в буфер обмена – Thariama

+0

на самом деле вы можете: http://www.htmlgoodies.com/beyond/javascript/article.php/3458851 – woodlumhoodlum

1

Мы разработали небольшой Firefox-AddOn для удаления специальных символов (дефис) при копировании/вставке содержимого из редактора. Это было необходимо, потому что нет javascript-способа для заполнения anyting в буфер обмена. Я предполагаю, что также можно написать расширение для Chrome (googel - ваш друг здесь). Кажется, это единственный способ получить то, что вы хотите с моей точки зрения.

Пример: Вот необходимый фрагмент кода для FireFox-Аддон для удаления специальных символов onCopy

// get Clipboard Object 
var clip = Components.classes["@mozilla.org/widget/clipboard;1"].createInstance(Components.interfaces.nsIClipboard); 

// get Transferable Object 
    var tr_unicode = new Transferable(); 
var tr_html = new Transferable(); 

// read "text/unicode flavors" (the clipboard has several "flavours" (html, plain text, ...)) 
    tr_unicode.addDataFlavor("text/unicode"); 
tr_html.addDataFlavor("text/html"); 
    clip.getData(tr_unicode, clip.kGlobalClipboard); // Systemclipboard 
    clip.getData(tr_html, clip.kGlobalClipboard); // Systemclipboard 

// generate objects to write the contents into (used for the clipboard)   
    var unicode = { }, ulen = { }, html = { }, hlen = { }; 

tr_html.getTransferData("text/html", html, hlen); 
tr_unicode.getTransferData("text/unicode", unicode, ulen); 

var unicode_obj = unicode.value.QueryInterface(Components.interfaces.nsISupportsString); 
var html_obj = html.value.QueryInterface(Components.interfaces.nsISupportsString); 

// we remove Softhyphen and another control character here 
var re = new RegExp('[\u200b' + String.fromCharCode(173)+ ']','g'); 

if (unicode_obj && html_obj) 
{ 
    var unicode_str = unicode_obj.data.replace(re, ''); 
    var html_str = html_obj.data.replace(re, ''); 

    // Neue Stringkomponenten für unicode und HTML-Content anlegen  
    var unicode_in = new StringComponent(); 
    unicode_in.data = unicode_str; 

    var html_in = new StringComponent(); 
    html_in.data = html_str; 

    // generate new transferable to write the data back to the clipboard 
    // fill html + unicode flavors 
    var tr_in = new Transferable(); 
    tr_in.setTransferData("text/html", html_in, html_in.data.length * 2); 
    tr_in.setTransferData("text/unicode", unicode_in, unicode_in.data.length * 2); 

    // copy content from transferable back to clipboard  
    clip.setData(tr_in, null, clip.kGlobalClipboard); 
} 
Смежные вопросы