Zclip打开只有点击类/复制从下一个元素

我已经意识到我有多糟糕，我在JS/jQuery没有使用它几十年。Zclip打开只有点击类/复制从下一个元素

我正在使用jQuery Zclip复制列表中的文本。但是我发现它每个页面只能在一个元素上工作。我发现一个解决方案为每个列表项目使用不同的ID，但由于会有大量的按钮，这将在未来创建大量不必要的工作。

我需要的是一个函数，它检查按钮元素后的span元素，并从中获取内容，而不是从特定的ID中获取内容。我如何通过jquery实现这一点？

这里是我的HTML/JS

<li><span class="server-name">SERVER NAME</span> 
    <br><button class="copy">COPY</button>IP:<span class="server-ip">127.0.0.1</span> 
</li>

jQuery的

$(document).ready(function() { 
    $('button.copy').zclip({ 
     path: 'scripts/ZeroClipboard.swf', 
     copy: $('span.description').text() 
    });

我希望你明白我的问题。

来源

2014-10-20 Fredrik Westerlund

@Satpal是正确的 - 它甚至在[用法]（http://www.steamdev.com/zclip/#usage） – CodingIntrigue 2014-10-20 11:45:39

@Regent页面，你可以通过源代码http://www.st eamdev.com/zclip/js/jquery.zclip.js \t'o.bind（'zClip_copy'，settings.copy）;' – Satpal 2014-10-20 11:50:07

@Regent True，但是在页面上的beforeCopy和afterCopy显示出这种行为，所以我认为'copy'也是 – CodingIntrigue 2014-10-20 11:50:11

您需要使用的功能与复制像

$('button.copy').zclip({ 
    path: 'scripts/ZeroClipboard.swf', 
    copy: function() { 
     return $(this).next('.server-ip').text(); //this here refers to element which invoked zclip 
    } 
});

你可以通过source code

o.bind('zClip_copy',settings.copy);

来源

2014-10-20 11:47:29 Satpal

这也适用，看起来像一个简单而好的解决方案。 – 2014-10-20 11:51:05

@FredrikWesterlund是的，特别是关于那个Satpal是第一个提出这个想法:) – Regent 2014-10-20 11:55:36

@Regent，我不应该删除评论。 – Satpal 2014-10-20 11:56:45

我不知道zclip，但你需要选择从后面按钮旁边元素文本，所以第四个行应该是：

copy: $(this).next('.server-ip').text()

来源

2014-10-20 11:36:22 panther

使用此解决方案时复制空白。：/ 但我认为这是正确的方向。 – 2014-10-20 11:40:11

这是行不通的，因为'this'指向'文件' – Regent 2014-10-20 11:40:38

给你li类（类似info：

<li class="info"> 
    <span class="server-name">SERVER NAME</span> 
    <button class="copy">COPY</button> 
    IP:<span class="server-ip">127.0.0.1</span> 
</li>

而在你的JS：

$(document).ready(function() { 
    // loop through all `.info` elements 
    $('.info').each(function() { 
     // get the button 
     var $button = $(this).find('.copy'); 

     // get the ip element 
     var $ip = $(this).find('.server-ip'); 

     // make button zclip 
     $button.zclip({ 
      path: 'scripts/ZeroClipboard.swf', 

      // the text of ip 
      copy: $ip.text() 
     }); 
    }); 
});

来源

2014-10-20 11:41:47 dashtinejad

这个解决方案似乎很好，谢谢！感谢您对脚本的全面描述，它对您有很大的帮助。 – 2014-10-20 11:47:12

看起来像copy参数可以是一个函数。如果它被调用（和看起来是）在当前按钮的情况下，那么接下来的代码应工作，只要你想：

$('button.copy').zclip({ 
    path: 'scripts/ZeroClipboard.swf', 
    copy: function() { 
     return $(this).next('.server-ip').text(); 
    } 
});

来源

2014-10-20 11:46:44 dfsq

很棒，谢谢！ – 2014-10-20 11:52:29

Zclip打开只有点击类/复制从下一个元素

回答

相关问题