这个程序大家来看看解决方法
日期：2014-05-16 浏览次数：20420 次
这个程序大家来看看
<html>
<head>
<script>
function pop(id)
{
var menu = document.getElementById(id);
if(menu.style.display=="none")
menu.style.display="block";
else
menu.style.display="none";
var html = "";
var id2 = "";
for(var j = 1; j <= 2; j++)
{
id2 = id + j;
html = html + "<li onClick=pop('" + id2 + "')>123</li><ul id='" + id2 + "' style='display:none'></ul>";
}
menu.innerHTML = html;
//document.write(id2);
}
</script>
</head>
<body>
<ul>
<%
String id = "here";
String idname = "";
for(int i = 1; i <= 3; i++)
{
idname = id + i;
%>
<li onClick="pop('<%=idname%>')"><%=i%></li>
<ul id="<%=idname%>" style="display:none">
</ul>
<%}%>
</ul>
</body>
</html>
为什么第2级菜单后面不能继续点开了?
------解决方案--------------------
问题的本质在于你点击了子菜单后由于冒泡事件响应机制
又调用了一遍根节点的pop事件，所以点不下去了
只要在function pop(id)中加一句event.cancelBubble = true;即可
function pop(id)
{
event.cancelBubble = true;
var menu = document.getElementById(id);
if(menu.style.display=="none")
menu.style.display="block";
else
menu.style.display="none";
var html = "";
var id2 = "";
for(var j = 1; j <= 2; j++)
{
id2 = id + j;
html += " <li onclick=pop('"+id2+"')>123</li ><ul id='"+id2+"' style='display:none'> </ul >";
}
menu.innerHTML = html;
//document.write(id2);
}
<html>
<head>
<script>
function pop(id)
{
var menu = document.getElementById(id);
if(menu.style.display=="none")
menu.style.display="block";
else
menu.style.display="none";
var html = "";
var id2 = "";
for(var j = 1; j <= 2; j++)
{
id2 = id + j;
html = html + "<li onClick=pop('" + id2 + "')>123</li><ul id='" + id2 + "' style='display:none'></ul>";
}
menu.innerHTML = html;
//document.write(id2);
}
</script>
</head>
<body>
<ul>
<%
String id = "here";
String idname = "";
for(int i = 1; i <= 3; i++)
{
idname = id + i;
%>
<li onClick="pop('<%=idname%>')"><%=i%></li>
<ul id="<%=idname%>" style="display:none">
</ul>
<%}%>
</ul>
</body>
</html>
为什么第2级菜单后面不能继续点开了?
------解决方案--------------------
问题的本质在于你点击了子菜单后由于冒泡事件响应机制
又调用了一遍根节点的pop事件，所以点不下去了
只要在function pop(id)中加一句event.cancelBubble = true;即可
function pop(id)
{
event.cancelBubble = true;
var menu = document.getElementById(id);
if(menu.style.display=="none")
menu.style.display="block";
else
menu.style.display="none";
var html = "";
var id2 = "";
for(var j = 1; j <= 2; j++)
{
id2 = id + j;
html += " <li onclick=pop('"+id2+"')>123</li ><ul id='"+id2+"' style='display:none'> </ul >";
}
menu.innerHTML = html;
//document.write(id2);
}
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
