picking up URL when link is clicked

[newbiegalore]

Hello everyone ,
Thanks to the gentle people on this group
for helping me out with previous issues. :-D This time round I am
facing what I perceive as a simple problem, which I have not found a
simple solution for (obviously!).

The problem: I need to pick up the URL in the address bar of a browser
when a link is clicked

What I have done: I have used,
a function which routes document.onclick into a func which uses
window.content.document.location.href to pick up the URL from the
address bar.

The issue: when I click link on the page the alert box displays the
URL in the address bar, not the address that I am planning to go to
when I click on the link. I tried to put in a delay before the address
bar content is picked up. I used setTimeout, a loop function but still
these only delay the picking up of the current URL in the address bar.
I thought that if I put in a delay, when I click a link, the URL in
the address bar would change and after 500 ms I could easily pick up
the destination URL.

Is there an elegant way to accomplish this? any pointers/comments/code
are very appreciated . I have searched this group and have not
found an exact solution. Do I have to take control of the HTTP
channel? Also, If I want to block access to the link, providing the
user with some info before he/she actually views the page, how could I
do it? Any pointers?

Thanks in advance

 

[Bjoern Hoehrmann]

* newbiegalore wrote in comp.lang.javascript:

The problem: I need to pick up the URL in the address bar of a browser
when a link is clicked

As I understand you, you want to know the address after it has changed.
The problem is that unless you have document internal links, it will
change only after the current document is unloaded -- and all scripts
running in the context of that document terminated. That's not possible,
instead you have to check which link is clicked and construct the URL
based on this information. You have to check the target of the event
and, say, for <a> elements check the href attribute. That's imperfect,
but there is no other way currently.

 

[newbiegalore]

* newbiegalore wrote in comp.lang.javascript:


As I understand you, you want to know the address after it has changed.
The problem is that unless you have document internal links, it will
change only after the current document is unloaded -- and all scripts
running in the context of that document terminated. That's not possible,
instead you have to check which link is clicked and construct the URL
based on this information. You have to check the target of the event
and, say, for <a> elements check the href attribute. That's imperfect,
but there is no other way currently.

Hello , thanks for the pointer. I used the following code, which
should parse the <a> tags in the current page but unfortunately does
not seem to list them in a new window! If you know of any resource
which discusses link parsing or finding which link was clicked could
you please point me to it.

Thanks again.

function extractlinks(e){

var links=document.all.tags("A")

var total=links.length

var win2=window.open("","","menubar,scrollbars")

win2.document.write("<h2>Total Links="+total+"</h2><br>")

for (i=0;i<total-1;i++){

win2.document.write(links.outerHTML+"<br>")

}

}


document.onload = extractlinks;

function kC(e) {


alert(window.content.document.location.href);

}


document.onclick = kC;

 

[newbiegalore]

function extractlinks(e){

var links=document.all.tags("A")

var total=links.length

var win2=window.open("","","menubar,scrollbars")

win2.document.write("<h2>Total Links="+total+"</h2><br>")

for (i=0;i<total-1;i++){

win2.document.write(links.outerHTML+"<br>")

}

}

window.onload = extractlinks;

function extractlinks(){
var links=document.links
var total=links.length
var win2=window.open("","","menubar,scrollbars")
win2.document.write("<h2>Total Links="+total+"</h2><br>")

for (var i=0;i<total;i++){
win2.document.write(links.parentNode.innerHTML+"<br>")

}
}

Mick

document.onload = extractlinks;

function kC(e) {


document.onclick = kC;

Hi Mick, thanks for the code correction, but when I tried it the
browser just seemed to stop! did not load home page. I also tried
something simpler,

function extractlinks(e){
var obj=document.getElementsByTagName('a')
for(i=0;i<obj.length;i++)
alert(obj.parentNode.innerHTML)
}

window.onload = extractlinks;

this too does not seem to work... hmmm, I'll keep hacking on it.
PS: I have tried using window instead of document and it did not seem
to make a difference.

 

[newbiegalore]

Hi Mick, thanks for the code correction, but when I tried it the
browser just seemed to stop! did not load home page. I also tried
something simpler,

function extractlinks(e){
var obj=document.getElementsByTagName('a')
for(i=0;i<obj.length;i++)
alert(obj.parentNode.innerHTML)
}

window.onload = extractlinks;

this too does not seem to work... hmmm, I'll keep hacking on it.
PS: I have tried using window instead of document and it did not seem
to make a difference.

Works for me. What error are you getting? Why the "e" parameter?
Mick

OK here's what happened. When the whole code is executed, all I see is
a white screen and firefox does not respond, there is no new window,
no alert box.

When I run just

alert('hello') within the extractlinks function, the first time I run
firefox, nothing happens but from the second time everything works.

when I use just,

var links=document.links
var total=links.length
alert(total)

again firefox gets kinda hosed and white screens are all I get, the
homepage does not open. If any specific details would help please let
me know. Thanks again for your time.

I am using Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en-US; rv:
1.8.1.13) Gecko/20080311 Firefox/2.0.0.13

 

[RobG]

Hello , thanks for the pointer. I used the following code, which
should parse the <a> tags in the current page but unfortunately does
not seem to list them in a new window! If you know of any resource
which discusses link parsing or finding which link was clicked could
you please point me to it.

You can either put an onclick handler on each link, or one higher up
the document tree to catch clicks on links. Here's a simple example
based on the first suggestion:

<title>Links</title>
<script type="text/javascript">

function showHref(e) {
alert(this.tagName + ': ' + this.href);
return false;
}

function init(){
var i = document.links.length;
while (i--) {
document.links.onclick = showHref;
}
}

</script>

<body>
<a href="foo.html">foo</a><br>
<a href="bar.html">bar</a><br>

Thanks again.

function extractlinks(e){

var links=document.all.tags("A")

A elements are not necessarily links, they may also be anchors. Also,
don't use the IE proprietary document.all, use W3C standards.

var links = document.links;

var total=links.length
var win2=window.open("","","menubar,scrollbars")
win2.document.write("<h2>Total Links="+total+"</h2><br>")

Most browsers will block pop-ups by default so it's not a good idea to
rely on them.

for (i=0;i<total-1;i++){

Keep variables, particularly counters, local using the var keyword. I
also don't understand why you want total-1 since that will skip the
last link;

for (var i=0; i<total; i++) {

win2.document.write(links.outerHTML+"<br>")

Don't use the IE proprietary outerHTML unless this is only for IE. It
is also better to construct a string of the HTML you wish to write,
then write it using a single document.write statement, consider
something like:

var link;
var html = [];
for (var i=0; i<total; i++) {
link = links;
html.push('<a href="' + link.href + '">'
+ link.innerHTML + '<\/a>';
}

// Use a single write
win2.document.write('<title>Links<\/title><h2>Total Links='
+ total + '<\/h2>' + html.join('<br>'));

// Don't forget to close the document
win2.document.close();

}

}

document.onload = extractlinks;

Add onload handlers using window.onload, or as <body onload="...">, or
simply run from a script just before the end of the body element.

 

[newbiegalore]

Hello , thanks for the pointer. I used the following code, which
should parse the <a> tags in the current page but unfortunately does
not seem to list them in a new window! If you know of any resource
which discusses link parsing or finding which link was clicked could
you please point me to it.

You can either put an onclick handler on each link, or one higher up
the document tree to catch clicks on links.  Here's a simple example
based on the first suggestion:

<title>Links</title>
<script type="text/javascript">

function showHref(e) {
  alert(this.tagName + ': ' + this.href);
  return false;

}

function init(){
  var i = document.links.length;
  while (i--) {
    document.links.onclick = showHref;
  }

}

</script>

<body>
  <a href="foo.html">foo</a><br>
  <a href="bar.html">bar</a><br>

  <script type="text/javascript">init && init();</script>

Thanks again.

function extractlinks(e){

        var links=document.all.tags("A")

A elements are not necessarily links, they may also be anchors.  Also,
don't use the IE proprietary document.all, use W3C standards.

  var links = document.links;

        var total=links.length
        var win2=window.open("","","menubar,scrollbars")
        win2.document.write("<h2>Total Links="+total+"</h2><br>")

Most browsers will block pop-ups by default so it's not a good idea to
rely on them.

        for (i=0;i<total-1;i++){

Keep variables, particularly counters, local using the var keyword.  I
also don't understand why you want total-1 since that will skip the
last link;

      for (var i=0; i<total; i++) {

                win2.document.write(links.outerHTML+"<br>")

Don't use the IE proprietary outerHTML unless this is only for IE.  It
is also better to construct a string of the HTML you wish to write,
then write it using a single document.write statement, consider
something like:

    var link;
    var html = [];
    for (var i=0; i<total; i++) {
      link = links;
      html.push('<a href="' + link.href + '">'
              + link.innerHTML + '<\/a>';
    }

    // Use a single write
    win2.document.write('<title>Links<\/title><h2>Total Links='
      + total + '<\/h2>' + html.join('<br>'));

    // Don't forget to close the document
    win2.document.close();

        }

document.onload = extractlinks;

Add onload handlers using window.onload, or as <body onload="...">, or
simply run from a script just before the end of the body element.

Guys, thanks a ton for the code comments and contribution. The thing
is your code works perfect when I run it as a standalone webpage. When
I run it by placing it in a .js file which is linked to the firefox
extension toolbar I am developing it just does not work. Only rally
rudimentary stuff like once click is pressed an alert pops up showing
the address bar url or a msg works. It just won't pick up anything
else. In fact, even when I try to just print using alert the var i =
document.links.length and I set the default homepage to digg.com which
has a large number of links on the page, it still won't do anything.

Again your code works great when it is present in the body of a
webpage. Thanks . However, I am trying to use the input from you
guys to try and make the js work for my toolbar.

I have tried using (document/window).on(click/load) = funcname;
function funcname(){

var i = document.links.length;
alert(i);
}

does not do anything! I have checked up on the MDC and the code you
guys have helped with matches with standards but still it just won't
do anything! arrrrrgh!

 

[newbiegalore]

You can either put an onclick handler on each link, or one higher up
the document tree to catch clicks on links.  Here's a simple example
based on the first suggestion:

<title>Links</title>
<script type="text/javascript">

function showHref(e) {
  alert(this.tagName + ': ' + this.href);
  return false;

}

function init(){
  var i = document.links.length;
  while (i--) {
    document.links.onclick = showHref;
  }

}

</script>

<body>
  <a href="foo.html">foo</a><br>
  <a href="bar.html">bar</a><br>

  <script type="text/javascript">init && init();</script>
</body>

A elements are not necessarily links, they may also be anchors.  Also,
don't use the IE proprietary document.all, use W3C standards.

  var links = document.links;

Most browsers will block pop-ups by default so it's not a good idea to
rely on them.

Keep variables, particularly counters, local using the var keyword.  I
also don't understand why you want total-1 since that will skip the
last link;

      for (var i=0; i<total; i++) {

                win2.document.write(links.outerHTML+"<br>")

Don't use the IE proprietary outerHTML unless this is only for IE.  It
is also better to construct a string of the HTML you wish to write,
then write it using a single document.write statement, consider
something like:

    var link;
    var html = [];
    for (var i=0; i<total; i++) {
      link = links;
      html.push('<a href="' + link.href + '">'
              + link.innerHTML + '<\/a>';
    }

    // Use a single write
    win2.document.write('<title>Links<\/title><h2>Total Links='
      + total + '<\/h2>' + html.join('<br>'));

    // Don't forget to close the document
    win2.document.close();

Add onload handlers using window.onload, or as <body onload="...">, or
simply run from a script just before the end of the body element.

Guys, thanks a ton for the code comments and contribution. The thing
is your code works perfect when I run it as a standalone webpage. When
I run it by placing it in a .js file which is linked to the firefox
extension toolbar I am developing it just does not work. Only rally
rudimentary stuff like once click is pressed an alert pops up showing
the address bar url or a msg works. It just won't pick up anything
else. In fact, even when I try to just print using alert the var i =
document.links.length and I set the default homepage to digg.com which
has a large number of links on the page, it still won't do anything.

Again your code works great when it is present in the body of a
webpage. Thanks . However, I am trying to use the input from you
guys to try and make the js work for my toolbar.

I have tried using (document/window).on(click/load) = funcname;
function funcname(){

 var i = document.links.length;
 alert(i);

}

does not do anything! I have checked up on the MDC and the code you
guys have helped with matches with standards but still it just won't
do anything! arrrrrgh!

The problem has ben resolved, more info at
http://forums.mozillazine.org/viewtopic.php?p=3339707#3339707