Member Avatar for lse123

what is the trick, when a user go to an external link of my page an alert, or confirm box appear, or run some other code?

  • 2 Contributors
  • 5 Replies
  • 315 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by Member #874591

Dani AI

Generated

As started to show, attaching handlers to links will work — but inline onclick or onunload is brittle and doesn't scale. A more robust, future‑proof method is to use event delegation: listen for clicks on the document, find the nearest <a> the user clicked, parse its URL and compare its origin/hostname to your page. That lets one handler cover every link and lets you show a custom confirm or your own modal for external destinations. (developer.mozilla.org)

Example (drop into a script block; no changes to existing HTML required):

document.addEventListener('click', function (e) {
  const a = e.target.closest && e.target.closest('a');
  if (!a || !a.href) return;
  // ignore anchors and script: links
  if (a.getAttribute('href').startsWith('#') || a.protocol === 'javascript:') return;

  const url = new URL(a.href, location.href);
  if (url.origin !== location.origin) {
    e.preventDefault();
    if (window.confirm('You are leaving this site. Continue?')) {
      if (a.target === '_blank') window.open(url.href, '_blank', 'noopener');
      else location.href = url.href;
    }
  }
});

This uses the DOM closest()/event.target pattern and the URL parser so you correctly detect cross‑origin links rather than relying on string matching. (developer.mozilla.org)

Do not rely on unload for prompts or alert/confirm during unload — browsers make UI interactions ineffective at that time. beforeunload can trigger a browser confirmation for unsaved data, but modern browsers no longer show custom text in that dialog (it’s controlled by the browser). Use click interception for link confirmation instead. (developer.mozilla.org)

It is not possible for a normal page to detect when a user manually types a URL into the address bar (that would be a huge privacy/security hole) — only browser extensions can get that kind of event. For outbound tracking, send a beacon or log the click before navigating. (stackoverflow.com)

When opening external links in a new tab, include rel="noopener noreferrer" (or at least noopener) to avoid window.opener attacks and protect privacy. Also avoid overusing intrusive confirmations — show them only where they help (forms with unsaved data, downloads, links to payment flows, etc.). (developer.mozilla.org)

Recommended Answers

All 5 Replies

Member Avatar for Member #874591

what is the trick, when a user go to an external link of my page an alert, or confirm box appear, or run some other code?

Well, you can use scripts to display such message boxes or confirm boxes when an user clicks on those links to external pages..

For ex:

<a href="xyz.com" onClick="msg()">Click Here!! </a>
<script language="javascript>
function msg()
{
alert('this link redirects to an external page');
}
</script>

You may also use confirm box to display an yes or no kinda thing..
I dont know whether the info you requested can be understood by my explanation. If its fine then thank you..

Member Avatar for lse123

there isn't any general function for all links whentarget is not of my domain, but external domain appear this message?

Member Avatar for Member #874591

there isn't any general function for all links whentarget is not of my domain, but external domain appear this message?

I am not exactly sure about that. But upon searching for some similar thing i stuumbled upon two links where something related to your request was found.

1.Detecting when an user is leaving your domain
http://www.irt.org/script/257.htm

2.Detecting browser close events
http://www.webdeveloper.com/forum/showthread.php?t=93810

3. And for much detailed info you can view this post..


Inform me if this was helpful

Member Avatar for lse123

any way detect, if type in browser a foreign url?

Member Avatar for Member #874591

I'm not sure about that.. i think u can try this and see if it works..

window.onunload = function() {
    alert("You're leaving this page.");
};
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.