• We’re currently investigating an issue related to the forum theme and styling that is impacting page layout and visual formatting. The problem has been identified, and we are actively working on a resolution. There is no impact to user data or functionality, this is strictly a front-end display issue. We’ll post an update once the fix has been deployed. Thanks for your patience while we get this sorted.

Need Help with a HTML / Javascript Problem

B

bladephoenix

Senior member
Hi,

Just wondering if I can get some help from you experts on how to solve an HTML / JS problem that I am having. Essentially, I am trying to write a JS function which will return the "name" attribute of the image which calls the function. Here is the the HTML code which I have written for the image (I am using square brackets instead of angled brackets so this post doesn't get messed up...please replace the square brackets with the appropriate angled brackets)

[a name="image1" href="link.htm" onMouseOver="returnMyName(event)"]

[/a]

Here is the JS code for the "returnMyName()" function:

function returnMyName(event) {
var imageName;
var doc = document;

if(doc.getElementById) {
if (navigator.appName == "Microsoft Internet Explorer") {
imageName = window.event.srcElement.name;
}
else if (navigator.appName == "Netscape") {
imageName = event.currentTarget.name;
}
}

if (imageName) {
alert(imageName);
}
}

The above coding works well with IE (it will bring up an alert saying "image1"). However, it does not work with Netscape or Firefox. The problem, obviously is the "event.currentTarget.name" code. I don't believe this is the correct syntax to get the name attribute of the image.

How can I fix this code? I have been searching on the net for more info on event.currentTarget, but I am at a loss.

Thanks for any help.
 
Originally posted by: bladephoenix
Hi,

Just wondering if I can get some help from you experts on how to solve an HTML / JS problem that I am having. Essentially, I am trying to write a JS function which will return the "name" attribute of the image which calls the function. Here is the the HTML code which I have written for the image (I am using square brackets instead of angled brackets so this post doesn't get messed up...please replace the square brackets with the appropriate angled brackets)

[a name="image1" href="link.htm" onMouseOver="returnMyName(event)"]

[/a]

Here is the JS code for the "returnMyName()" function:

function returnMyName(event) {
var imageName;
var doc = document;

if(doc.getElementById) {
if (navigator.appName == "Microsoft Internet Explorer") {
imageName = window.event.srcElement.name;
}
else if (navigator.appName == "Netscape") {
imageName = event.currentTarget.name;
}
}

if (imageName) {
alert(imageName);
}
}

The above coding works well with IE (it will bring up an alert saying "image1"). However, it does not work with Netscape or Firefox. The problem, obviously is the "event.currentTarget.name" code. I don't believe this is the correct syntax to get the name attribute of the image.

How can I fix this code? I have been searching on the net for more info on event.currentTarget, but I am at a loss.

Thanks for any help.[/quote]

are you certain that navigator.appName for Netscape returns "Netscape"? [url="http://www.mozilla.org/docs/dom/domref/dom_window_ref38.html"]This[/url] link tells me otherwise, that it returns "Navigator" instead.

My suggestion would be to eliminate the else if() statement and replace it by just a plain else to see if this is indeed the problem. If so, problem solved and you know what to do. If not, report back to us.

By the way, fusetalk (or at least anandtech) allows you to post whatever code you want without fear of the browser interpretting it.

<html>
<a href="www.google.com">see?</a>
<h1>woot</h1>
</html>
Click to expand...
 
Hmm...how odd. When I type "javascript:alert(navigator.appName);" into the address bar of Firefox it brings up a box saying "Netscape". *confused*

Well, I tried replacing it with an else statement, but that doesn't seem to work...I am pretty certain that it is the "event.currentTarget.name" as when I tried (using the new "else" statement) it returns alerts blank box.

Originally posted by: Zugzwang152
Originally posted by: bladephoenix
Hi,

Just wondering if I can get some help from you experts on how to solve an HTML / JS problem that I am having. Essentially, I am trying to write a JS function which will return the "name" attribute of the image which calls the function. Here is the the HTML code which I have written for the image (I am using square brackets instead of angled brackets so this post doesn't get messed up...please replace the square brackets with the appropriate angled brackets)

[a name="image1" href="link.htm" onMouseOver="returnMyName(event)"]

[/a]

Here is the JS code for the "returnMyName()" function:

function returnMyName(event) {
var imageName;
var doc = document;

if(doc.getElementById) {
if (navigator.appName == "Microsoft Internet Explorer") {
imageName = window.event.srcElement.name;
}
else if (navigator.appName == "Netscape") {
imageName = event.currentTarget.name;
}
}

if (imageName) {
alert(imageName);
}
}

The above coding works well with IE (it will bring up an alert saying "image1"). However, it does not work with Netscape or Firefox. The problem, obviously is the "event.currentTarget.name" code. I don't believe this is the correct syntax to get the name attribute of the image.

How can I fix this code? I have been searching on the net for more info on event.currentTarget, but I am at a loss.

Thanks for any help.[/quote]

are you certain that navigator.appName for Netscape returns "Netscape"? [url="http://www.mozilla.org/docs/dom/domref/dom_window_ref38.html"]This[/url] link tells me otherwise, that it returns "Navigator" instead.

My suggestion would be to eliminate the else if() statement and replace it by just a plain else to see if this is indeed the problem. If so, problem solved and you know what to do. If not, report back to us.

By the way, fusetalk (or at least anandtech) allows you to post whatever code you want without fear of the browser interpretting it.

<html>
<a href="www.google.com">see?</a>
<h1>woot</h1>
</html>[/quote]

Click to expand...
Click to expand...
 
Having not looked at your code, I can tell you one thing that is a real pain when writing javascript between IE and Firefox, etc.. I have noticed that IE strips out textNodes that only have "whitespace" type characters such as newline and the like, meanwhile Firefox and the like leave those in, so in a situation of something like:

<br />

<br />

IE will see: BR with the nextSibling being BR, where firefox will have BR -> #text -> BR...That might help you look at the problem at a different angle, hope you solve it...
 
Why all go thru all this trouble?

if you did this -- i.e. you pass a reference to the href:

<a href='...' onmouseover='returnMyName(this);'>...</a>


function returnMyName(theHref){

alert(theHref.name);


}

You don't need to worry abt browser specfic stuff and all that crud.
Not sure if the `.name` will work - havent tried it, but you could do a getAttribute.
 
Ugh...why didn't I think of that?? Oh well...in the context in which I am using this, it might actually be useful for it to utilize sending the event.

Well anyway I did get it working yesturday. I used the code:
event.currentTarget.attributes['name'].nodeValue

Originally posted by: statik213
Why all go thru all this trouble?

if you did this -- i.e. you pass a reference to the href:

<a href='...' onmouseover='returnMyName(this);'>...</a>


function returnMyName(theHref){

alert(theHref.name);


}

You don't need to worry abt browser specfic stuff and all that crud.
Not sure if the `.name` will work - havent tried it, but you could do a getAttribute.
Click to expand...

 
You must log in or register to reply here.

TRENDING THREADS

Back
Top