document.oncontextmenu页面右键菜单功能(2008-09-04 17:49:31| 分类： jsp+html+js+Ajax)

最新推荐文章于 2022-10-25 16:03:41 发布

luckykapok918

最新推荐文章于 2022-10-25 16:03:41 发布

阅读量1.1k

点赞数

分类专栏： jsp+html+js+Ajax

本文链接：https://blog.csdn.net/luckykapok918/article/details/8278084

版权

jsp+html+js+Ajax 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

今天修改别人的页面右键菜单位置问题，虽然对页面的右键功能不是很熟悉，不过还好能上网.问题的现象是这样的当在没有滚动条的情况下右键菜单位置正常，但出现滚动条下方的位置时，菜单位置不对，和鼠标位置相差很远。(很明显应该是滚动条出现引起的问题，不过苯啊，开始竟然没看出来)
很老实的一步一步跟着原来程序员的代码走：java里面通过
StringBuilder sb = new StringBuilder("\n<li");
sb.append( " οncοntextmenu=\"showonsub(this,'"+ addUrl
                 + "','" + modUrl + "','" + delUrl + "');\"");
   return sb.toString();
的方法把构件的jsp内容返回页面：
<div id="isTree" class="leftmenu">
<ul class="menuList">
    <%
try {
  out.print(service.buildLeftMenu(person, moduleId));
} catch (Exception ex) {
  ex.printStackTrace();
}
%>
</ul>
</div>
页面有div区块来装。通过out.print（String）;方法把树型菜单和相对应的右键菜单画出来。
在页面的jscript中调用 οncοntextmenu=showonsub(this,addurl,modurl,delurl) Fuction做出每个节点对应的右键菜单位置和内容。
function showonsub(obj,addurl,modurl,delurl){
   nodeClick(obj);
document.idfrom.id.value=obj.nodeid;
document.idfrom.addurl.value=addurl;
document.idfrom.modurl.value=modurl;
document.idfrom.delurl.value=delurl;
document.idfrom.issubmenu.value="true";
document.οncοntextmenu=showMenu;
}
   然后再调用 showMenu Fuction
function showMenu(){
var x, y, w, h, ox, oy;
x = event.clientX;
y = event.clientY;
var obj = document.getElementById("rightmenu");
if (obj == null)
   return true;
ox = document.body.clientWidth;
oy = document.body.clientHeight;
if(x > ox || y > oy)
   return false;
w = obj.offsetWidth;
h = obj.offsetHeight;
if((x + w) > ox)
    x = x - w;
if((y + h) > oy)
    y = y - h;
obj.style.posLeft = x + document.documentElement.scrollLeft;
obj.style.posTop = y + document.documentElement.scrollTop;
obj.style.visibility = "visible";
return false;
}
==
clientX
   检索与窗口客户区域有关的鼠标光标的X坐标，属性为只读，没有默认值。
clientY
   检索与窗口客户区域有关的鼠标光标的Y坐标，属性为只读，没有默认值。
==
document.body.clientWidth
    网页可见区域宽;
document.body.clientHeight
    网页可见区域高;
==
假设 obj 为某个 HTML 控件。

obj.offsetTop 指 obj 距离上方或上层控件的位置，整型，单位像素。

obj.offsetLeft 指 obj 距离左方或上层控件的位置，整型，单位像素。

obj.offsetWidth 指 obj 控件自身的宽度，整型，单位像素。

obj.offsetHeight 指 obj 控件自身的高度，整型，单位像素。
==
a=document.body.scrollLeft+event.clientX
意思是判断浏览器是否支持滚动条滚位置的功能. 网页横向滚动条的左位置加上事件源的X坐标
==

找到各个不懂的点以后，分析应该是最后的属性document.body.scrollTop和document.body.scrollLeft的问题，在网上一查，找到了对这原因的解释：是因为我的ＨＴＭＬ文件头部加了文档类型。

<!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">

方法１.去掉头部文档类型。

方法２.把document.body.scrollTop和document.body.scrollLeft这两个家伙改个名字：

document.documentElement.scrollTop 和document.documentElement.scrollLeft。

当然document.body.clientWidth和document.body.clientHeight也要改名字了，改为：

document.documentElement.clientWidth和document.documentElement.clientHeight
一般推荐方法2 ，因为上面那串文档类型体现了XHTML是用XML写成的，他描述的是该文档使用的DTD（文档类型定义）。其中PUBLIC代表公用DTD，还有一个SYSTEM代表系统 DTD，存储在本地磁盘中，调用结构良好的XML文件时会使用到。所以最后不要动它
通过今天下午的调试和修改，学到一点点页面方面的东西，也发现了还有好多东西都没接触到，HTML语言不是原来看的那么简单，真的是一门入门容易，精通难的东西。看来以后还的多学习啊！

luckykapok918

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
document.oncontextmenu页面右键菜单功能(2008-09-04 17:49:31| 分类： jsp+html+js+Ajax)

今天修改别人的页面右键菜单位置问题，虽然对页面的右键功能不是很熟悉，不过还好能上网.问题的现象是这样的当在没有滚动条的情况下右键菜单位置正常，但出现滚动条下方的位置时，菜单位置不对，和鼠标位置相差很远。(很明显应该是滚动条出现引起的问题，不过苯啊，开始竟然没看出来) 很老实的一步一步跟着原来程序员的代码走：java里面通过 StringBuilder sb = new StringBu
复制链接

扫一扫