Home > Blockchain >  Open a new page onclick on a div element
Open a new page onclick on a div element

Time:08-24

I don't know if it's possible but I'm trying to open a page by clicking on an HTML element. I detail below.

I have a web page in HTML with a source code from a third party tool (a code with products for affiliate purchases). So when the user clicks on one of the products in this code he is redirected to the third party merchant. Let's imagine the code as follows:

<head>
<script async defer src="[linkremoved]"></script>
</head>
<body>
<!-- my page content -->
<div>
<!-- Partner code -->
<div data-gyg-href="[linkremoved]" data-gyg-locale-code="fr-FR" data-gyg-q="Neuhausen"></div>
</div>
<!-- my page content -->
</body>

What I would like is that if the user clicks on a product, my site opens a page too, with a text like "Were you able to find your products? We would be interested in your feedback".

That's how I tried it but without success :

<head>
<script async defer src="[linkremoved]"></script>
</head>
<body>
<!-- my page content -->
<a href ="comments.html" target="_blank">
<div>
<!-- Partner code -->
<div data-gyg-href="[linkremoved]" data-gyg-locale-code="fr-FR" data-gyg-q="Neuhausen"></div>
</div></a>
<!-- my page content -->
</body>

CodePudding user response:

If it's what im thinking the easiest way to do that is just by using javascript, example below.

// If you want to redirect user without opening a new tab, use this
// window.location.href="https://example.com";

// But if you want to open a new tab, use this
// window.open("https://www.example.com", "_blank");

function noNewTab() {
  window.location.href="https://example.com";
}

function newTab() {
  window.open("https://www.example.com", "_blank");
}

function localFile() {
   // First we will need to get the url of your webpage
   let currentUrl = window.location.origin;
   // To what file redirect?
   let redirectFile = "test.html";

   // And redirect. We will need to add / before the file path
   window.location.href = currentUrl   "/"   redirectFile;
   
}
<div onclick="noNewTab()">
  <p> Example product. Click on me! (No new tab) </p>
</div>

<div onclick="newTab()">
  <p> Example product. Click on me! (New tab) </p>
</div>

<div onclick="localFile()">
  <p> Example product. Click on me! (Change file, not url) </p>
</div>

With new tab it depends on browser if it allows to show it. On the modern browsers there is popout asking for access

CodePudding user response:

A possible approach is to use target="_blank" along with a click handler, like

 <a href="https://www.w3schools.com" target="_blank" onclick="yourfunction()">Visit W3Schools</a> 

If you need to trigger this programmatically, then you can:

window.open(yoururl);
//Your further code...

CodePudding user response:

I think that you should try to use span instead of div tag or maybe a p tag

<a href ="comments.html" target="_blank">
  <span>
    < HERE IS THE PARTNER CODE >
  </span>
</a>
  • Related