如何设置JS右键的行数?代码中我做了6个功能,但右键显示的时候它只显示了3个,怎么解决?
<%--
/**
*实现右键菜单功能
*/
--%>
<html>
<body oncontextmenu = showMenu( ' ')>
<form name = "menuForm ">
<!--隐藏框,用来保存选择的菜单的id值-->
<input type = "hidden " name = "id " value = " ">
<table>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '0 ')> 根目录 </a> </td> </tr>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '1 ')> 菜单一 </a> </td> </tr>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '2 ')> 菜单二 </a> </td> </tr>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '3 ')> 菜单三 </a> </td> </tr>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '4 ')> 菜单四 </a> </td> </tr>
<tr> <td> <a href= "javascript:clickMenu() " oncontextmenu = showMenu( '5 ')> 菜单五 </a> </td> </tr>
</table>
</form>
</body>
<!-- 这里用来定义需要显示的右键菜单 -->
<div id= "itemMenu " style= "display:none ">
<table border= "1 " width= "100% " height= "100% " bgcolor= "#cccccc " style= "border:thin " cellspacing= "0 ">
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.create() ">
新增节点
</td>
</tr>
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.create1() ">
新增页面
</td>
</tr>
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.update(); ">
修改节点
</td>
</tr>
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.update1(); ">
修改页面
</td>
</tr>
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.del() ">
删除节点
</td>
</tr>
<tr>
<td style= "cursor:default;border:outset 1; " align= "center " onclick= "parent.del1() ">
删除页面
</td>
</tr>
</table>
</div>
<!-- 右键菜单结束-->
</html>
<script language= "JavaScript ">
/**
*根据传入的id显示右键菜单
*/
function showMenu(id)
{
menuForm.id.value = id;
if( " " == id)
{
popMenu(itemMenu,100, "100 ");
}
else
{
popMenu(itemMenu,100, "111 ");
}
event.returnValue=false;
event.cancelBubble=true;
return false;
}
/**
*显示弹出菜单
*menuDiv:右键菜单的内容
*width:行显示的宽度
*rowControlString:行控制字符串,0表示不显示,1表示显示,如“101”,则表示第1、3行显示,第2行不显示
*/
function popMenu(menuDiv,width,rowControlString)
{
//创建弹出菜单
var pop=window.createPopup();
//设置弹出菜单的内容
pop.document.body.innerHTML=menuDiv.innerHTML;
var rowObjs=pop.document.body.all[0].rows;
//获得弹出菜单的行数
var rowCount=rowObjs.length;
//循环设置每行的属性
for(var i=0;i <rowObjs.length;i++)
{
//如果设置该行不显示,则行数减一
var hide=rowControlString.charAt(i)!= '1 ';
if(hide){
rowCount--;
}
//设置是否显示该行
rowObjs[i].style.display=(hide)? "none ": " ";
//设置鼠标滑入该行时的效果
rowObjs[i].cells[0].onmouseover=function()
{
this.style.background= "#818181 ";
this.style.color= "white ";
}
//设置鼠标滑出该行时的效果
rowObjs[i].cells[0].onmouseout=function(){
this.style.background= "#cccccc ";
this.style.color= "black ";
}
}
//屏蔽菜单的菜单
pop.document.oncontextmenu=function()
{
return false;
}
//选择右键菜单的一项后,菜单隐藏
pop.document.onclick=function()
{
pop.hide();
}
//显示菜单
pop.show(event.clientX-1,event.clientY,width,rowCount*25,document.body);
return true;
}
function create()
{
alert( "create " + menuForm.id.value + "! ");
}
function update()
{
alert( "update " + menuForm.id.value + "! ");
}
function del()
{
alert( "delete " + menuForm.id.value + "! ");
}
function create1()
{
alert( "create " + menuForm.id.value + "! ");
}
function update1()
{
alert( "update " + menuForm.id.value + "! ");
}
function del1()
{
alert( "delete " + menuForm.id.value + "! ");
}
function clickMenu()
{
alert( "you click a menu! ");
}
</script>
[解决办法]
if( " " == id)
{
popMenu(itemMenu,100, "100 ");
}
else
{
popMenu(itemMenu,100, "111111 ");//这里的问题,你循环里有判断,应该是非6个1
}