PDA

View Full Version : Detect Element ID onClick



kermit_cof
03-08-2006, 09:49 AM
Hi

:confused: I'm having serious difficulty with the following script concept:

(Element: DIV / Textbox)

I need a script that detects an element's ID during an onClick or onMouseover and passes it to a unique variable.
Ideally, the script should be an external / global script and not be embedded within the element (all elements will be assigned an ID - The OnClick/Mouseover event can be called from the element).

Your help will be greatly appreciated!!

Thanks in advance,
Kermit

jscheuer1
03-08-2006, 10:13 AM
I found this a bit amusing. It would be so much easier for someone to help you if you explained what you are trying to do. The method you outline could be done (well, probably as, it is not very clear) but, it would be pointless under most circumstances. Especially the part about putting each id into a unique variable. To be of any real value (under most circumstances) one variable would be used for all the id's, only its value would change as the mouse moved over or clicked on the various elements on the page. You really should decide on mouseover or onclick as well. For a document wide script, onclick is much more feasible but, onmouseover could work, depending upon the purpose and the construction of the page in general.

kermit_cof
03-08-2006, 11:22 AM
Ok - one variable and onClick is ok. Basically I'm trying to detect the ID of the element that got clicked on, then pass that to a variable. Then call a function that looks at that variable, pass it again as an ID.
For example: Var thisID = 'ThisDiv' then in the function: document.getElementbyId('thisID').

After that I can do virtually anything to the element that got clicked on.
I don't want to write a function/script for each and every element; when all I need is the ID of the element that got clicked on passed to a variable, which in turn can be used within a function.

Hope that clarifies things a bit! Anymore questions, please don't hesitate to ask.

Thanks again!

jscheuer1
03-08-2006, 02:54 PM
I can work with that. Here is a demo:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html id="doc">
<head>
<title>Grab ID - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var theId
function grabID(e){ //modified from script at: http://www.quirksmode.org/js/events_properties.html#target
var targ;
if (!e) var e = window.event;
if (e.target) targ = e.target;
else if (e.srcElement) targ = e.srcElement;
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode;
theId=targ.id
alert(theId) //this line may be removed or commented out
}

document.onclick=grabID;
</script>
</head>
<body id="bod">
Hi
</body>
</html>

Notes: So as to not allow a situation where an element will have no id, even the html and body tags must have one as shown in this demo. Since you are really just after the element, you might want to consider using or otherwise modifying the script this was modified from at Quirksmode (http://www.quirksmode.org/js/events_properties.html#target).

kermit_cof
03-09-2006, 07:25 AM
Hahahahahaha! It works!:D

Thanks for your help!