prince4prodigy
جمعه 10 شهریور 1391, 21:06 عصر
اگه ممکنه در مورد تفاوت this و event بگید و این که چه موقع از کدومشون استفاده میشه؟
(محصوصا به عنوان آرگومنت برای روبداد ها چه موقغ از this و چه موقغ از event استفاده میشه؟)
برای مثال 2 کد زیر رو در نظر بگیرید :
<!DOCTYPE html>
<html>
<head>
<script>
function whichElement(e)
{
var targ;
if (!e)
{
var e=window.event;
}
if (e.target)
{
targ=e.target;
}
else if (e.srcElement)
{
targ=e.srcElement;
}
var tname;
tname=targ.tagName;
alert("You clicked on a " + tname + " element.");
}
</script>
</head>
<body onmousedown="whichElement(event)">
<p>Click somewhere in the document. An alert box will alert the name of the element you clicked on.</p>
<h3>This is a heading</h3>
<img border="0" src="smiley.gif" alt="Smiley" width="32" height="32" />
<p>This is a paragraph.</p>
</body>
</html>
و
<!DOCTYPE html>
<html>
<head>
<script>
function bigImg(x)
{
x.style.height="64px";
x.style.width="64px";
}
function normalImg(x)
{
x.style.height="32px";
x.style.width="32px";
}
</script>
</head>
<body>
<img onmousemove="bigImg(this)" onmouseout="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32" />
<p>The function bigImg() is triggered when the user moves the mouse pointer over the image. This function enlarges the image.</p>
<p>The function normalImg() is triggered when the mouse pointer is moved out of the image. That function changes the height and width of the image back to normal.</p>
</body>
</html>
(محصوصا به عنوان آرگومنت برای روبداد ها چه موقغ از this و چه موقغ از event استفاده میشه؟)
برای مثال 2 کد زیر رو در نظر بگیرید :
<!DOCTYPE html>
<html>
<head>
<script>
function whichElement(e)
{
var targ;
if (!e)
{
var e=window.event;
}
if (e.target)
{
targ=e.target;
}
else if (e.srcElement)
{
targ=e.srcElement;
}
var tname;
tname=targ.tagName;
alert("You clicked on a " + tname + " element.");
}
</script>
</head>
<body onmousedown="whichElement(event)">
<p>Click somewhere in the document. An alert box will alert the name of the element you clicked on.</p>
<h3>This is a heading</h3>
<img border="0" src="smiley.gif" alt="Smiley" width="32" height="32" />
<p>This is a paragraph.</p>
</body>
</html>
و
<!DOCTYPE html>
<html>
<head>
<script>
function bigImg(x)
{
x.style.height="64px";
x.style.width="64px";
}
function normalImg(x)
{
x.style.height="32px";
x.style.width="32px";
}
</script>
</head>
<body>
<img onmousemove="bigImg(this)" onmouseout="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32" />
<p>The function bigImg() is triggered when the user moves the mouse pointer over the image. This function enlarges the image.</p>
<p>The function normalImg() is triggered when the mouse pointer is moved out of the image. That function changes the height and width of the image back to normal.</p>
</body>
</html>