Скопируйте текст в буфер обмена, используя Zero Clipboard в asp.net

Я пытаюсь использовать Ноль *Буфер обмена* для копирования текста из Текстового поля в Буфер обмена, когда клиент щелкает >Кнопка. Я пытаюсь это сделать много дней, но мне не повезло сделать эту работу.

В сценарии у меня есть одно текстовое поле, которое отображает данные из базы данных. У меня есть одна Кнопка, которая при нажатии клиентом должна копировать текст Текстового поля. Я пробовал следовать, но это не работает.

Некоторая помощь будет оценена по достоинству.

 <script type="text/javascript" src="/Scripts/ZeroClipboard.js"></script>
    <script type="text/javascript">
        ZeroClipboard.setMoviePath('/Scripts/ZeroClipboard.swf');
    </script>



<script>
    function test() {

        ZeroClipboard.setMoviePath('/Scripts/ZeroClipboard.swf');
        //create client
        var clip = new ZeroClipboard.Client();

        //event
        clip.addEventListener('mousedown', function () {
            clip.setText(document.getElementById('TextBox2').value);

        });
        clip.addEventListener('complete', function (client, text) {
            alert('copied: ' + text);

        });
        //glue it to the button
        clip.glue('d_clip_button');

    }
</script>

<asp:TextBox ID="TextBox2" runat="server" BorderStyle="None"  Enabled="False" Font-Size="Medium" ForeColor="Black" Width="213px"></asp:TextBox>
            &nbsp;<asp:Button ID="d_clip_button" runat="server" Text="Copy" OnClientClick="javascript:test();" />

person Amrit Sharma    schedule 02.07.2013    source источник


Ответы (1)


Прежде всего, вы пытаетесь выбрать элемент по неправильному идентификатору. Поскольку вы используете веб-формы, правильный способ:

getElementById('<%=TextBox2.ClientID%>')

Кроме того, хорошее решение в ненавязчивом стиле js может выглядеть так:

$().ready(function () {
    ZeroClipboard.setDefaults({ moviePath: "/Scripts/ZeroClipboard.swf" });

    var clip = new ZeroClipboard(document.getElementById('YourButtonId')); //or '<%=YourButton.ClientID%>' if you use asp.net button

    clip.on('complete', function (client, args) {
        alert("Copied text to clipboard: " + args.text);
    });
});

Также ваша кнопка должна иметь атрибут данных data-clipboard-target (на самом деле это можно сделать тремя способами). Установка атрибутов данных для управления веб-формами сложна, поэтому вы можете не использовать здесь кнопку asp.net и сделать это следующим образом:

<input type="button" value="clickme" id="YourButtonId" data-clipboard-target="<%=TextBox2.ClientID %>"/>

Наслаждаться!

person Sergio    schedule 11.07.2013
comment
Я до сих пор не могу сделать эту работу. Не могли бы вы реализовать это в jsfiddle. - person Amrit Sharma; 12.07.2013