0

My HTML:

   <Div Class='POSTS'>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text1</Div>
    </Div>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text2</Div>
    </Div>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text3</Div>
    </Div>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text4</Div>
    </Div>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text5</Div>
    </Div>
    <Div Class='POST'>
        <Div Class='CONTENT'>Text6</Div>
    </Div>
</Div>

And It Continues Without Any Limit...(Never Ending) With Different Text Inside Each Element With Class Of "CONTENT".

I Searched Over This Website And Found This :

Https://Stackoverflow.Com/Questions/400212/How-Do-I-Copy-To-The-Clipboard-In-Javascript

But In The Project That I'm Working In I Can't Specify Id On Each Element As You Know It's Infinite Number Of These Elements:

<Div Class='POST'>
        <Div Class='CONTENT'>some text</Div>
    </Div>

So It Needs To Be Automatically Added.

And I Want To : When User Clicks On The Text Inside Of Element With The Class Of "CONTENT" (No Matter How Long The Text Is And What It Have) , The Entire Text And Tags And ... Be Copied To Clipbored.

I Don't Want To Set Buttons ! I Want To Make The Whole

Tags,Text,And .... Be Copied On Each One Of Them Without Any Limits! By Clicking on it's own text.(imagine this as a textarea that user clicks on text inside of it and js copies all of text but this one is div with text inside of it)

If You Think I Missed Sth And It's Not Clear Enough Let Me Know!

Thanks In Advance!

Mahdi
  • 51
  • 7

1 Answers1

1

This should solve your problem. First select the entire object and then get the element which was clicked. Copy the content.

var posts = document.querySelector(".POSTS"); 

posts
  .addEventListener("click", function (e) {
    console.log("index", e.target);
    navigator.clipboard.writeText(e.target.innerText).then(
      function () {
        console.log("Async: Copying to clipboard was successful!");
      },
      function (err) {
        console.error("Async: Could not copy text: ", err);
      }
    );
  });
Ayush Koshta
  • 93
  • 10