jQuery плагин для добавления ссылок в буфер обмена

У многих из нас есть блоги, интернет-магазины, новостные сайты etc… Понятное дело стараемся опубликовывать оригинальный контент, но что же происходит после появления контента в интернетах, его конечно же просматривают и если он интересный, пользователи иногда обмениваются ссылкой на страничку с контентом. Новые переходы на нужную страницу и нам очень хорошо, а что если наш отличный текст просто взяли скопировали и скинули в аську\скайпик\почту — наш текст ушел, а перехода нету :(.

addtocopy plugin

Запретить копирование, это очень неправильно, весело и смешно ©, но мы ведь можем при копировании добавить в буфер обмена ссылку на наш сайтик. Рассмотрим как же нам это лучше сделать:

— Написать обработчик события для CTRL + C, «Копировать», придется работать с буфером обмена, а с ним не работается в современных браузерах.
— Использовать костыли в виде flash. Тоже не очень, +1 зависимость, да и в 10 версии для копирования в буфер нужен клик по интерфейсу флешки.
— А, что если будем смотреть что юзер выделяет курсором и аккуратно подсовывать нашу ссылку, хе хе хе, вот для реализации такого метода я и написал эту статью.

Работает все это как плагин для jQuery.

Создадим элемент на основе инициализации плагина, который будем подсовывать копипастеру.

var options = {htmlcopytxt: ’ More: <a href=»‘+window.location.href+'»>'+window.location.href+’</a>', minlen:25, addcopyfirst: false}
$.extend(options, usercopytxt);
var copy_sp = document.createElement(’span');
copy_sp.id = ’ctrlcopy';
copy_sp.innerHTML = options.htmlcopytxt;

Если копипастер выделил текст, то добавляем нашу ссылку в выделенный текст.

$(this).mouseup(function(){
if(window.getSelection){ //для хороших 
selected=window.getSelection();
seltxt=selected.toString();
nslct = selected.getRangeAt(0);
seltxt = nslct.cloneRange();
seltxt.collapse(false);
seltxt.insertNode(copy_sp);
nslct.setEndAfter(copy_sp);
selected.removeAllRanges();
selected.addRange(nslct);
} else if(document.selection){ //для плохих 
selected = document.selection;
nslct=selected.createRange();
seltxt=nslct.text;
seltxt=nslct.duplicate();
seltxt.collapse(false);
seltxt.pasteHTML(copy_sp.outerHTML);
nslct.setEndPoint(»EndToEnd»,seltxt);
nslct.select();
}
});

При новом mousedown будем чистить старый копирайт-элемент со ссылкой.

$(this).mousedown(function(){
$(’#ctrlcopy').remove();
});

Естественно ссылка не должна быть видна, добавляем нужное оформление для нее:

<style>
#ctrlcopy {
height:1px;
overflow:hidden;
position:absolute;
width:1px;
margin: 5px 0 0 -1px;
line-height:0;
opacity: 0;
}
</style>

Как пользоваться:

— Плагин: Скачать addtocopy

<script type=»text/javascript»>
$(function(){
$(»#content»).addtocopy({htmlcopytxt: ’ Подробнее: <a href=»‘+window.location.href+'»>'+window.location.href+’</a>', minlen:35, addcopyfirst: false});
});
</script>

Опции обрабатываемые плагином:

Опция	Описание
htmlcopytxt	что добавлять к скопированному в буфер, принимает html
minlen	минимальная длинна выделяемого текста, принимает int
addcopyfirst	добавлять htmlcopytxt в начало буфера обмена или в конец, true/false

Пример: тут

Известные глюки:
В Опере текст выделяется с лева на право
В Firefox’e если addcopyfirst: true, то текст в первый раз не выделяется

jQuery плагин для добавления ссылок в буфер обмена

Опции обрабатываемые плагином:

Добавить комментарий Отменить ответ