Проблема с использованием ZeroClipboard для копирования текста с библиотекой zClip - PullRequest
0 голосов
/ 25 марта 2012

У меня проблемы с копированием текста с помощью zeroclipboard.Это мой HTML-код:

<dl class="codebox"><dt>Code: <a href="#" onclick="selectCode(this); return false;">Select all</a> | <a id="copytxt" href="#" onclick="return false;" class="">Copy to clipboard</a><div class="zclip" id="zclip-ZeroClipboardMovie_1" style="position: absolute; width: 97px; height: 15px; z-index: 99; left: 196px; top: 1032px; "><embed id="ZeroClipboardMovie_1" src="code/ZeroClipboard.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="97" height="15" name="ZeroClipboardMovie_1" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=1&amp;width=97&amp;height=15" wmode="transparent"></div></dt><dd><code>This is my code that I want to copy</code></dd></dl>

Это мой код JQuery для копирования текста:

<script type="text/javascript">
$(document).ready(function(){
        $("#copytxt").zclip({
            path: "code/ZeroClipboard.swf",
            copy: function(){return jQuery(".codebox").find(".prettyprint");}
      });
});
</script>

Вот где у меня возникают проблемы, потому что, когда я нажимаю кнопку Копировать в буфер обменассылка дает мне окно с предупреждением, но говорит, что ничего не скопировано, что означает, что все в порядке, кроме этой части:

copy: function(){return jQuery(".codebox").find(".prettyprint");}

Я пытался все, чтобы решить эту проблему.У меня также есть другая проблема, приведенный выше код только встраивает zeroclipboard в первый элемент с идентификатором 'copytxt', а не все из них.

Вот одно из мест, где возникает проблема (на моем форуме): -removed-

Не знаю, поможет ли это, но я использую phpBB.И я также использую zclip: http://www.steamdev.com/zclip/ для zeroclipboard.

Спасибо.

1 Ответ

0 голосов
/ 25 марта 2012

Причина, по которой он прикрепляется только к одному элементу с идентификатором copytxt, заключается в том, что на странице может быть только один элемент с данным идентификатором. Идентификаторы должны быть уникальными.

Вероятно, он ничего не копирует в буфер обмена, потому что опция copy: принимает функцию, которая возвращает: «любую строку, или любое выражение или функцию javascript, которая возвращает строку». Ваша функция возвращает объект jQuery, который не является строкой. Если вы хотите получить текст из элемента .prettyprint (который вы не показали в своем примере HTML), то вам нужно получить текст из него следующим образом:

 copy: function(){return jQuery(".codebox").find(".prettyprint").text();}

Если вы хотите, чтобы он работал более чем в одном месте, тогда используйте имена классов вместо идентификаторов и используйте селектор, который выберет все объекты с этим именем класса.

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

Чтобы получить его относительно того, на что нажимали, и разрешить работу нескольким из них, вы можете изменить id="copytxt" на class="copytxt" и использовать такой код:

<script type="text/javascript">
$(document).ready(function(){
        $(".copytxt").zclip({
            path: "code/ZeroClipboard.swf",
            copy: function() {
                return jQuery(this).closest(".codebox").find(".prettyprint").text();
            }
      });
});
</script>

Добавление jQuery(this).closest(".codebox") запускает поиск объекта .prettyprint у ближайшего предка, у которого class = "codebox" до точки щелчка. Таким образом, он поднимется по дереву предков, откуда произошел щелчок, найдет родительский элемент codebox, а затем найдет prettyprint в этом кодовом поле.

Изменение на $(".copytxt").zclip позволяет ему возвращать все объекты с class="copytxt", а не только один объект с id="copytxt".

...