Question

我正在尝试使用ZeroClipboard使用以下内容复制和格式化页面上两个换行元素：

<script type="text/javascript">
        $(document).ready(function() {
            var clip = new ZeroClipboard($('#d_clip_button1, #d_clip_button2'), {
            moviePath: "/img/ZeroClipboard.swf"
            } );

        clip.on("dataRequested", function (client, args) {

        var txt = $('#copy_1, #copy_2').html();

        var windowsText = txt.replace(/\n/g, '\r\n');

        windowsText = windowsText.replace(/<br\s*\/?>/g, "\r\n");

        client.setText(windowsText);

        });

        clip.on( "load", function(client) {

        client.on( "complete", function(client, args) {
        // `this` is the element that was clicked

        alert("Copied to clipboard: " );
    });
  });
});                     
</script>

<pre id="copy_1">blah blah blah</pre>中的文字格式正常。

但是，我的其他元素<pre id="copy_2">blah blah blah no. 2</pre>会输出id="copy_1"

中的文字

如何让两个元素都正确格式化？

Answer 1

James Greene（https://github.com/JamesMGreene）想出了answer：

你的专栏：

var txt = $('#copy_1, #copy_2').html();

将始终只返回ID为“copy_1”的元素的innerHTML，因为jQuery's html() method仅对集合中第一个返回的元素执行：

在HTML文档中，.html（）可用于获取任何内容元件。如果选择器表达式匹配多个元素，只有第一个匹配才会返回其HTML内容。

假设您的#d_clip_button [1/2]粘合元素对应于#copy_ [1/2]元素，您可以执行以下操作：

clip.on("dataRequested", function(client, args) {
  var txt, windowsText,
      targetId = this.getAttribute("data-clipboard-target"),
      targetEl = !targetId ? null : document.getElementById(targetId);
  if (targetEl) {
    txt = $(targetEl).html();
    windowsText = txt.replace(/\n/g, "\r\n");
    windowsText = windowsText.replace(/<br\s*\/?>/g, "\r\n");
    client.setText(windowsText);
  }
});

使用ZeroClipboard格式化多个元素的文本？

1 个答案: