Search code examples
javascriptjqueryzclip

zClip - Copy only visible text


Hey hopefully this is an easy solution:

On click of the button I want to be able to copy only the text that is visible within the id="description". what am I doing wrong?

HTML:

<p id="description"> Test <span style="display:none">test2</span></p>
<button type="button" id="copy-description">Click Me!</button>

jQuery:

<script type="text/javascript" src="js/jquery.zclip.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$('#copy-description').zclip({
    path:'js/ZeroClipboard.swf',
    copy:$('p#description').text()
});

// The link with ID "copy-description" will copy
// the text of the paragraph with ID "description"


$('a#copy-dynamic').zclip({
    path:'js/ZeroClipboard.swf',
    copy:function(){return $('input#dynamic').val();}
});

// The link with ID "copy-dynamic" will copy the current value
// of a dynamically changing input with the ID "dynamic"

});

</script>

Solution

  • It needs to be in a parent tag like a p tag and then call the span visible within that tag.

    HTML:

     <p id="description">
        <span id=""> Test </span>
        <span style="display:none; visibility:hidden;">test2</span>
    </p>
    

    jQuery:

    $('#copy-description').zclip({
        path:'js/ZeroClipboard.swf',
        copy:$('#description span:visible').text()
    });