I have this code:

<button onclick="copyStringToClipboard(this.getAttribute('data-target'))" id = 'accbtn1'  data-target="accbtn1"   > mypassword </button>

<script>
function copyStringToClipboard (target) {
   var str = document.getElementById(target).innerText;
   var el = document.createElement('textarea');
   el.value = str;
   el.setAttribute('readonly', '');
   el.style = {position: 'absolute', left: '-9999px'};
   document.body.appendChild(el);
   el.select();
   document.execCommand('copy');
   document.body.removeChild(el);
}
</script>

I only need that the word "mypassword" is hide from the button but without hide the button. Is there a way to copy the word that i set in the html code without display it?

Many thanks

CodePudding user response：

<button onclick="copyStringToClipboard(this.getAttribute('data-target')); hide()" id='accbtn1' data-target="accbtn1" > <span id="hide">mypassword</span> </button>

<script>
  function copyStringToClipboard(target) {
    var str = document.getElementById(target).innerText;
    var el = document.createElement('textarea');
    el.value = str;
    el.setAttribute('readonly', '');
    el.style = {
      position: 'absolute',
      left: '-9999px'
    };
    document.body.appendChild(el);
    el.select();
    document.execCommand('copy');
    document.body.removeChild(el);
  }

  function hide() {
    var mypasswordLBL = document.getElementById("hide").style.display = "none";
}
</script>

Simple. if you want something else with the code ASK in comment

CodePudding user response：

many thanks for reply. I tried to copy your code in html page. At first time i see the word "mypassword" but after one click, disappears and i see only the button. Is there a way to hide always the word "mypassword" and show only the button? Thanks a lot again