$(this)到底是获取的谁

dh2258628 2012-07-21 03:52:24

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
var data = { "../Image/p_large_Lw04_52a70000850a5c41_副本.jpg": ["../Image/p_large_Lw04_52a70000850a5c41.jpg", "高恩灿", "18", "180"] }
$(function () {
$.each(data, function (key, value) {
//创建元素节点
var smallimg = $("<img src = '" + key + "' />");
//给元素节点赋予属性
smallimg.attr("bigImg", value[0]);
smallimg.attr("personName", value[1]);
smallimg.attr("personOld", value[2]);
smallimg.attr("personHeight", value[3]);

smallimg.mouseover(function (e) {
$("#detailImg").attr("src", $(this).attr("bigImg"));
$("#detailName").text($(this).attr("personName"));
$("#detailOld").text($(this).attr("personOld"));
$("#detailHeight").text($(this).attr("personHeight"));
$("#details").css("left", e.pageX).css("top", e.pageY).css("display", "");
});

$("#btnClose").click(function () {
$("#details").css("display", "none");
});

$("body").append(smallimg);
});
});
</script>
</head>
<body>
<div style="display: none; position: absolute" id="details">
<img id="detailImg" />
<p id="detailName">
</p>
<p id="detailOld">
</p>
<p id="detailHeight">
</p>
<input type="button" id="btnClose" value="关闭" />
</div>
</body>
</html>

上面是自己看视频时做的练习，下面问题来了...

下面这段代码：
smallimg.mouseover(function (e) {
$("#detailImg").attr("src", $(this).attr("bigImg"));
$("#detailName").text($(this).attr("personName"));
$("#detailOld").text($(this).attr("personOld"));
$("#detailHeight").text($(this).attr("personHeight"));
$("#details").css("left", e.pageX).css("top", e.pageY).css("display", "");
});

例如$("#detailImg").attr("src", $(this).attr("bigImg"));中$(this)获取的对象为什么是smalling而不是$("#detailImg")这个对象呢？还有在这里用e来替换$(this)是有错的，为什么？e和$(this)的区别在哪儿？

小弟新手，望各位不要笑话...

谢谢！

...全文