我正忙着通过实现一个小系统向jQuery介绍自己,其中onmouseover在一个元素上导致文本气球弹出靠近元素.我觉得我在这里使用过多的香草JS,所以请建议我可以改进的地方以及这段代码有什么问题:
<head runat="server">
<script type="text/javascript" src="Scripts/jquery-1.3.2.js"></script>
<script type="text/javascript">
$('document').ready(function() {
$('span.balloon').each(function() {
this.style.display = "none";
});
$('span.ballooned').mouseover(function(event){
if (event.currentTarget.attributes["balloonid"]) {
var blnArr = $("#" + event.currentTarget.attributes["balloonid"].value);
if (blnArr.length > 0) {
blnArr[blnArr.length - 1].style.display = "inline";
};
};
});
});
</script>
</head>
<body>
<div>
This is some text where I describe a <span class="ballooned" balloonId="bln-1">text field</span> and want to attach extra info to that phrase.
</div>
<span class="balloon" id="bln-1">nvarchar(8)</span>
</body>
Joe*_*ung 11
$(function() {
$("span.balloon").hide();
$("span.ballooned[balloonid]").mouseover(
function() {
var balloonid = "#" + $(this).attr("balloonid");
$(balloonid).css("display", "inline");
});
});
首先,让我说使用vanilla js没有任何问题,如果你确定它不依赖于浏览器.jQuery框架并不是要替换任何和所有javascript语法.我想大多数人会说jQuery旨在解决一个长期存在的问题,即迫使开发人员处理我们无法控制的浏览器战争; 2)简化为满足当天需求而经常需要的复杂任务.
也就是说,我建议你使用jQuery的CSS函数来设置属性.