2013-05-08 2 views
0

Я просмотрел этот сайт вместе со многими другими, и я не вижу ответа нигде.Zeroclipboard, вызванный любым элементом с классом = «копия»

В настоящее время у меня есть сайт с несколькими кнопками и панель предварительного просмотра. Текст, отображаемый в области предварительного просмотра, отличается в зависимости от кнопки, на которой пользователь в настоящее время витает.

<body> 
<div="preview_pane"> <!--ALL TEXT IS SHOWN HERE --> </div> 

<div id="button_group"> 
    <div class="copy_me" id="stock1"></div> <!--THIS SHOWS STOCK TEXT--> 
    <div class="copy_me" id="stock2"></div> <!--COMPLETELY DIFFERENT TEXT--> 
    <div class="copy_me" id="stock3"></div> <!--YET SOME OTHER DIFFERENT TEXT--> 
    <div class="copy_me" id="stock4"></div> <!--OTHER COMPLETELY DIFFERENT TEXT--> 
</div> 

</body> 

Что я хочу сделать, так это создать zeroclipboard для создания наложения вспышки на любой кнопке с классом copy_me. Все эти кнопки должны скопировать текст, показанный на панели предварительного просмотра.

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

Я не могу вручную добавить скрипт к каждой кнопке, так как будет более 50 текстовых кнопок.

У меня нет опыта работы со вспышкой или javascript (только в jQuery), поэтому для меня это совершенно новое.

Любая помощь будет принята с благодарностью.

ответ

0

Я быстро посмотрел на api docs для zeroclipboard, и я хочу использовать метод клея и передать массив dom-узлов. В этом случае, вы хотите, чтобы все узлы с именем класса «copy_me», так:

var clip = new ZeroClipboard(); 
clip.glue(document.getElementsByClassName('copy_me')); 
1

отвечал на подобный вопрос на https://stackoverflow.com/a/26200988/3471658

Попробуйте использовать http://www.steamdev.com/zclip/ это позволяет вам прямой доступ к jquery, и вы можете использовать свою собственную логику в инструкции return.

включают jquery.zclip.js скачать и сохранить ZeroClipboard.swf

Вот отрывок:

$(".class-to-copy").zclip({ 
    path: "assets/js/ZeroClipboard.swf", 
    copy: function(){ 
     return $(this).attr("data-attribute-with-text-to-copy"); 
    } 
}); 

Убедитесь, что вы измените путь ГИФов.

Смежные вопросы