...

View Full Version : Calling Function problem



jklanka
01-26-2006, 11:27 AM
Dear All

I am using Mozilla browser and I have a table cell calling a function with onClick(). <td onClick="function1()".....>

Within the same cell i have placed an image which also having a onClick javascript function attached. <img onClick="function2()"..>

If I click the other area except image within the cell, the cell attached javascript function1 is called.

If I click on the image it is calling function attached to image first and function attached to cell also next.

How I can avoid calling cell attached function1 when I am clicking the image.

Please help me.

mentalhorse
01-26-2006, 01:27 PM
Hmm... try
event.cancelBubble = true;
I'm not sure if that will work. Try posting your code.
I don't exactly know where it will go yet.. yeah post your code.

vwphillips
01-26-2006, 01:34 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--

function Img(zxce){
if (zxcEventObj(zxce).tagName!='IMG'){ return; }
alert('IMAGE');

}

function TD(zxce){
if (zxcEventObj(zxce).tagName!='TD'){ return; }
alert('TD');

}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=tt_eobj.parentNode;
return zxceobj;
}

//-->
</script></head>

<body>
<table border="1" >
<tr>
<td width=100 onclick="TD(event);" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Up1.gif" onclick="Img(event);" >
</td>
</tr>
</table>
</body>

</html>

Kor
01-26-2006, 01:38 PM
use a global which is to be modified according to the nature of your clicked target


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
var param;
function fun1(){
if(Boolean(param)){return}
alert('this is a div');
}
function fun2(){
alert('this is an img');
}
document.onclick=function(e){
var target = (e && e.target) || (event && event.srcElement);
param =(target.nodeName.toLowerCase()=='img')?0:1;
}
</script>
</head>
<body>
<div style="background:#cccccc;width:300px" onclick="fun1()"><img src="00.jpg" onclick="fun2()"></div>
</body>
</html>

vwphillips
01-26-2006, 01:53 PM
node/tag names are uppercase

Kor
01-26-2006, 02:03 PM
node/tag names are uppercase
this is why I have used:

param =(target.nodeName.toLowerCase()=='img')?0:1;

You were not attentive

vwphillips
01-26-2006, 02:07 PM
perhaps I was being too criptic for you so

target.nodeName=='IMG'

is best

Kor
01-26-2006, 02:13 PM
it is the same... I usually write everything in lowercase, so that, in my way of coding, i have used toLowerCase().

target.nodeName=='IMG'
is the same with
target.nodeName.toLowerCase()=='img'

It does not matter... Let it be your way, if that is to you...:)

vwphillips
01-26-2006, 02:23 PM
bad haddits can be hard to break

You were not attentive

Kor
01-26-2006, 03:06 PM
it is not a bad habbit, I don't know why is this quarell about. There is not a single way to code correctly. Both
target.nodeName=='IMG'
and
target.nodeName.toLowerCase()=='img'
are correct, so why so much trouble?... You may code your way, I will code mine. As long as it is a correct code, no problem at all.

liorean
01-26-2006, 03:17 PM
There are benefits to both approaches. The obvious problem with upper case string equality comparison is for XHTML documents that may be sent as XML or XHTML instead of HTML. The lower case transformation fixes this, but is slightly uglier. I'd have used /img/i.test(target.nodeName) instead myself, but any of those three approaches works just fine for plain HTML.

Kor
01-26-2006, 03:24 PM
oh, yes liorean, I forgot about this regexp comparision you have post a couple of days... And yes, as I have said there, I always think about XML and XHTML

vwphillips
01-26-2006, 07:38 PM
liorean

thank you for your considered and informative responce



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum