求一段JavaScript,在指定的位置，显示或隐藏某一区域a hrefjavascript:show(#MyArea)詳細如下/a..
求一段JavaScript,在指定的位置，显示或隐藏某一区域
<a href="javascript:show('#MyArea')">詳細如下</a>
...
<div id="MyArea">
希望在指定的地方表示出来
</div>
因 <a>詳細如下</a> 是动态生成的，位置不定。
要求： MyArea区域在 <a>詳細如下</a> 的相对位置下面表示出来或隐藏。
(最好用jquery)
[解决办法]
- HTML code
<a href="#" onclick="javascript:show('MyArea',this)">詳細如下</a>
[解决办法]
这个要点就是获取被点击<a>的位置，给你段jquery版本的.
html代码同3#
- JScript code
function show(id,obj){ var obj=$(obj); var position=obj.position(); $("#"+id).css("position","absolute").css("left",position.left).css("top",position.top+obj[0].offsetHeight).css("display","");}
[解决办法]
看看这是不是你要的效果
- JScript code
<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><script type="text/javascript">var lastTarget = null;function change(evt) { var e = evt || window.event; var target = e.srcElement || e.target; var obj = document.getElementById("obj"); var rect = target.getBoundingClientRect(); obj.style.left = rect.left + "px"; obj.style.top = rect.bottom + "px"; if(target == lastTarget) obj.style.display = obj.style.display == "" ? "none" : ""; else obj.style.display = ""; lastTarget = target;}</script><body><div style="position:relative;left:100px;top:100px;"><a href="#" onclick="change(event)">点我</a><div style="position:relative;left:100px;top:50px;"><a href="#" onclick="change(event)">点我</a></div></div><div style="position:absolute;left:300px;top:400px;"><a href="#" onclick="change(event)">点我</a></div><div id="obj" style="position:absolute;width:100px;height:100px;border:1px gray solid;display:none;"></div></body></html>
[解决办法]
a的onclick添加return false，阻止执行href
<a href="#" onclick="show('xxxxx',this);return false">afafa</a>