无限级菜单

最新推荐文章于 2024-07-09 20:42:41 发布
最新推荐文章于 2024-07-09 20:42:41 发布
阅读量455 收藏
点赞数
分类专栏： 开发应用 php 文章标签： 无限级菜单 list
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/echocdzh/article/details/50295427
版权 
<?php
require_once("d:/AppServ/www/BBS/database_config.php");
if(isset($_POST['tj']))
{
   //获取值
    //print_r($_POST);
   $value=$_POST['bk'];
   $number=$_POST['h'];
   $value3=$_POST['new_bankuai_4'];
    for($i=0;$i<count($value);$i++)
   {
      $comand="insert into bbs_subarea values(null,'".$number[$i]."','".$value[$i]."','".$value3[$i]."')";
   mysql_query($comand);
    }


}
?>
<!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=gb2312" />
<link rel="stylesheet" href="css/common.css" type="text/css" />
<title>无限接连菜单</title>
<script>
var xmlhttp;
function check_ajax_xmlhttp()
{
try{
      xmlhttp=new  XMLHttpRequest();
 }
 catch(e)
 {
  try
  {
  
    xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch(e)
  {
       try
       {
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
       catch(e)
       {
      xmlhttp=false;
      alert("当前浏览器不支持ajax!请升级您的浏览器版本！");
       }
  }
 }
}

function add_new(num,_id)
{
     var obj=num.previousSibling;
  var value=obj.childNodes;
 
  if(value[1].innerHTML=="版块阶梯名称")
  {
       var _newtr=document.createElement("tr");
       var _newtd1=document.createElement("td");
       var _newtd2=document.createElement("td");
       var _newtd3=document.createElement("td");
       var _newtd4=document.createElement("td");
    _newtd1.setAttribute("align","center");
    _newtr.setAttribute("id","_id");
    _newtd1.innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='0'><input  type='hidden' name='h[]' id='"+_id+"' value='"+_id+"'>";
    _newtd2.innerHTML="<input name='bk[]' type='text'size='15'value='新分区名称'>";
    _newtr.appendChild(_newtd1);
    _newtr.appendChild(_newtd2);
    _newtr.appendChild(_newtd3);
    _newtr.appendChild(_newtd4);
       num.parentNode.insertBefore(_newtr,num);
    //alert(document.getElementById(_id).value);
    }
      else
   {  
       var _obj=num.parentNode;
   var _length=_obj.childNodes.length-6;
   var _newtr=document.createElement("tr");
       var _newtd1=document.createElement("td");
       var _newtd2=document.createElement("td");
       var _newtd3=document.createElement("td");
       var _newtd4=document.createElement("td");
    _newtd1.setAttribute("align","center");
    _newtr.setAttribute("id","_id");
    if(_length<10)
    {
      _newtd1.innerHTML="<input name='new_bankuai3[]'  id='"+_length+"' type='text'size='5' value='0'><input  type='hidden' name='h[]' id='"+_length+"' value='00"+_length+"'>";
           }else if(_length<100)
     {
        _newtd1.innerHTML="<input name='new_bankuai3[]' id='"+_length+"' type='text'size='5' value='0'><input  type='hidden'  name='h[]' id='"+_length+"' value='0"+_length+"'>";
     }
           _newtd2.innerHTML="<input name='bk[]' type='text'size='15'value='新分区名称'>";
    _newtr.appendChild(_newtd1);
    _newtr.appendChild(_newtd2);
    _newtr.appendChild(_newtd3);
    _newtr.appendChild(_newtd4);
       num.parentNode.insertBefore(_newtr,num);
       //alert(document.getElementById(_length).value);
  
 }
}
function test1(obj,id)
{
   // 根据当前对象去找到他的父节点直到找到tr
  var _tr=obj.parentNode.parentNode;
  var new_tr=_tr.cloneNode(true);
 
  var m=obj.parentNode.parentNode;//tr//找到当前对象所在的行
    if(m.nextSibling.id.length==3)
 {
   if(m.previousSibling.id.length==0)
   {
     new_tr.id=id+"001";
     new_tr.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='"+new_tr.id+"'><input  type='hidden' name='h[]' id='"+new_tr.id+"' value='"+new_tr.id+"'>";
  new_tr.childNodes[1].innerHTML="|------><input type='text' name='bk[]' value='新版块名称2'>";//追加
  var next_tr=_tr.nextSibling;//找到他的下一个兄弟节点
    _tr.parentNode.insertBefore(new_tr,next_tr);
       return;
  }
  
} 
 else if(m.nextSibling.id.length==6 || m.nextSibling.id.length==3)
 {

   var id=m.nextSibling.id;
   //alert(id);
       var obj2=document.getElementById(id);
    var _tr2=obj2.parentNode.parentNode;
       var new_tr2=_tr.cloneNode(true);
     new_tr2.id="00"+String(Number(id)+1);
   new_tr2.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='"+new_tr2.id+"'><input  type='hidden' name='h[]' id='"+new_tr2.id+"' value='"+new_tr2.id+"'>";
  new_tr2.childNodes[1].innerHTML="|------><input type='text' name='bk[]' value='新版块名称2'> ";//追加
  obj2.parentNode.insertBefore(new_tr2,obj2);
  //var s=new_tr.id;
  //alert(document.getElementById(s));
 }
 if(_tr.previousSibling.id.length==3 || _tr.previousSibling.id.length==6 || _tr.previousSibling.id.length==9)
 {
  
   
    if(_tr.nextSibling.id.length==6 || m.nextSibling.id.length=="new_m")
    {}
    else
    {
       new_tr.id=_tr.id+"001";
  var id3=new_tr.id;
   new_tr.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='"+new_tr.id+"'><input  type='hidden' name='h[]' id='"+new_tr.id+"' value='"+new_tr.id+"'>";
  new_tr.childNodes[1].innerHTML="|------><input type='text' name='bk[]' value='新版块名称2'> ";//追加
  var next_tr=_tr.nextSibling;//找到他的下一个兄弟节点
    _tr.parentNode.insertBefore(new_tr,next_tr);
    }
 }
}
function test3(obj3,id)
{
var tr_=obj3.parentNode.parentNode.parentNode;
var new_tr_=tr_.cloneNode(true);
  //alert(tr_.id);//没有第三级的情况
 if(tr_.nextSibling.id.length==3 )
 {
     new_tr_.id=tr_.id+"001";
  var id=new_tr_.id;
  //alert(id);
new_tr_.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='0'><input  type='hidden' name='h[]' id='"+id+"' value='"+id+"'>";
new_tr_.childNodes[1].innerHTML="|------------><input name='bk[]' type='text' value='新版块名称3'> <select name='new_bankuai_4[]' id='new_bankuai_4'><option  value='无'>无</option><option  value='坛内事务版块'>坛内事务版块</option><option  value='技术交流类版块'>技术交流类版块</option><option  value='发布公告类版块'>发布公告类版块</option><option  value='发起活动类版块'>发起活动类版块</option><option  value='娱乐灌水类版块'>娱乐灌水类版块</option></select>";

//追加
   var next_tr_=tr_.nextSibling;//找到他的下一个兄弟节点
   tr_.parentNode.insertBefore(new_tr_,next_tr_);
 
  }
 else if(tr_.nextSibling.id.length==9)
 {
//获取他的下一级的id
var next_id=tr_.nextSibling.id;
//alert(next_id);
//找到他的下一个兄弟节点
var obj2=document.getElementById(next_id);
var new_tr_2=tr_.cloneNode(true);
new_tr_2.id="00"+String(Number(next_id)+1);
//alert(new_tr_2.id);
new_tr_2.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='0'><input  type='hidden' name='h[]' id='"+new_tr_2.id+"' value='"+new_tr_2.id+"'>";
new_tr_2.childNodes[1].innerHTML="|------------><input name='bk[]'' type='text' value='新版块名称3'> <select name='new_bankuai_4[]' id='new_bankuai_4'><option  value='无'>无</option><option  value='坛内事务版块'>坛内事务版块</option><option  value='技术交流类版块'>技术交流类版块</option><option  value='发布公告类版块'>发布公告类版块</option><option  value='发起活动类版块'>发起活动类版块</option><option  value='娱乐灌水类版块'>娱乐灌水类版块</option></select>";
obj2.parentNode.insertBefore(new_tr_2,obj2);
}
 else
 {
     new_tr_.id=tr_.id+"001";
  var id=new_tr_.id;
  //alert(id);
  new_tr_.childNodes[0].innerHTML="<input name='new_bankuai3[]' id='new_number3[]' type='text'size='5' value='0'><input  type='hidden' name='h[]' id='"+id+"' value='"+id+"'>";
new_tr_.childNodes[1].innerHTML="|------------><input name='bk[]' type='text' value='新版块名称3'> <select name='new_bankuai_4[]' id='new_bankuai_4'><option  value='无'>无</option><option  value='坛内事务版块'>坛内事务版块</option><option  value='技术交流类版块'>技术交流类版块</option><option  value='发布公告类版块'>发布公告类版块</option><option  value='发起活动类版块'>发起活动类版块</option><option  value='娱乐灌水类版块'>娱乐灌水类版块</option></select>";

//追加
   var next_tr_=tr_.nextSibling;//找到他的下一个兄弟节点
   tr_.parentNode.insertBefore(new_tr_,next_tr_);
  }
}


</script>
</head>

<body>
<div id="man_zone">
<form name="form4" action="bbs_tsg.php" method="post">

  <table width="99%" border="0" align="center"  cellpadding="3" cellspacing="1" class="table_style">
    <tr>

   <td  class="left_title_1" colspan="4" align="left" ><span class="left-title">版块管理</span></td>

    </tr>
    <tr>
      <td align="left" colspan="4">--><span class="left-title"  style="font-size:18px; font-weight:800;  color:#73938E">技巧提示</span></td>

    </tr>
    <tr>
      <td colspan="4"><ul><li type="disc">版主用户名为粗体，则表示该版主权限可继承到下级版块</li></ul></td>
   
    </tr>
    <tr>
      <td class="left_title_1" style="width:10%; text-align:center" >显示顺序</td>
   <td class="left_title_1" style="65%; text-align:left" >版块阶梯名称</td>
   <td class="left_title_1"  style="width:12% ; text-align:center">版主</td>
   <td class="left_title_1" style="width:12%; text-align:center" >操作</td>
    </tr>
 <?php
   $comand="select * from bbs_subarea order by number";
      $result=mysql_query($comand);
      $num=mysql_num_rows($result);
    if($num>0)
     {
   while($row=mysql_fetch_array($result))
   {
        $number_length = strlen($row[1])/3;
     if($number_length==1)
     {
  
   ?>
    <tr id="<?=$row[1]?>">
     <td style="text-align:center" >
     <input type="text"  id="<?=$row[1]?>" size="5" value="0"></td>
     <td style="text-align:left; font-weight:900">
     <input type="text"  size="15" value="<?=$row[2]?>" style="font-weight:900"/>
     <input type="button" value="+" style="cursor:hand; color:#FFFFFF; background-color:#FF9933; font-weight:900" οnclick="test1(this,'<?=$row[1]?>')">
     </td>
      <td style="text-align:center" ><a href="#">添加版主</a></td>
    <td style="text-align:center"><a href="#">编辑</a>/<a href="#">删除</a></td>
   </tr>
 <?php
   }
   elseif($number_length==2)
   {
 ?>
 <tr id="<?=$row[1]?>">
      <td style="text-align:center" >
   <input type="text"  size="5" value="0">
   </td>
   <td style="text-align:left;">|------>
   <input type="text"  id="<?=$row[1]?>" size="15" value="<?=$row[2]?>">
   <input type="hidden" value="<?=$row[1]?>"> 
   <a href="#">
<input name="<?=$row[1]?>" id="<?=$row[1]?>" type="button" value="+" style="cursor:hand; color:#FFFFFF; background-color:#FF9933; font-weight:900" οnclick=" test3(this,'<?=$row[1]?>');" >
   </a>
   </td id="m_er">
    <td style="text-align:center" ><a href="#">添加版主</a></td>
     <td style="text-align:center"><a href="#">编辑</a>/<a href="#">删除</a></td>
    </tr>
 <?php
  }
   elseif($number_length==3)
   {
 ?>
 <tr id="<?=$row[1]?>" >
      <td style="text-align:center" >
   <input  id="<?=$row[1]?>" type="text"  size="5" value="0"></td>
   <td style="text-align:left;">|------------>
   <input type="text"   size="15" value="<?=$row[2]?>">                   
   <input  type="hidden" value="<?=$row[1]?>"> 
                 <select name="san" >
                          <option value="<?=$row[3]?>" selected="selected"><?=$row[3]?>
        <option  value='无'>无</option>
        <option  value='坛内事务版块'>坛内事务版块</option>
        <option  value='技术交流类版块'>技术交流类版块</option>
        <option  value='发布公告类版块'>发布公告类版块</option>
        <option  value='发起活动类版块'>发起活动类版块</option>
        <option  value='娱乐灌水类版块'>娱乐灌水类版块</option>
                 </select>
   </td>
    <td style="text-align:center" > </td>
     <td style="text-align:center"> </td>
    </tr>
 <?php
 }
  }
}
?>
<?php
  $sql="select number from bbs_subarea where number like '___' order by number desc";
  $result=mysql_query($sql);
  $num=mysql_num_rows($result);
  $number=substr($row[0],-3,3)+1;
  $new_num=sprintf("%03d",$number);
?>
   <tr id="new_m" >
     <td style="text-align:center" > </td>
     <td style="text-align:left;"><a href="#" style="color:#FF9933; font-size:12px"><input type="button" value="+" style="cursor:hand; color:#FFFFFF; background-color:#FF9933; font-weight:900" οnclick="add_new(new_m,'<?=$new_num?>');">添加新分区 </a>
   </td>
    <td style="text-align:center" > </td>
     <td style="text-align:center"> </td>
    </tr>
<?

?>
 
 
    <tr>
      <td  align="center"  colspan="4">
   <input name="tj"  type="submit" value=" 提 交 " /></td>
    </tr>
 
 <tr bgcolor="#FFFFFF></tr>
  </table>
</form>
</div>
</body>
</html>

echoHelloWord
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue3 应用element plus 实现菜单无限级
qq_35191010的博客
04-06 3118
vue3中实现无限极菜单
管理后台无限级菜单
u014650004的博客
07-20 903
管理后台菜单遍历 很久就想做一个通用的管理后台出来，一直太懒没做，今天开始粗略搞了一下，只是先把框架搭建好，菜单栏弄了，主要分享一下菜单的制作，用的layui + thinkphp6 1）先看效果图 2）后台获取菜单数据关键代码 //获取菜单 public function menu(){ $data = Db::table('sys_menu')->where(['status'=>1])->order('sort','asc')->select()->toArr
无限极下拉菜单（两种方式实现：递归/递归+DOM）
黎小小的博客
08-05 1944
1.第一种思路：递归 无论哪种思路实现都需注意不能生成一级菜单后直接渲染到页面，而是需要生成所有的DOM节点及内容后，才一次性渲染到页面。 思路： 根据pid和id进行关联是否是父子级菜单 最终是将所以递归获得的数据渲染到页面，所以递归函数需要有返回值; 展开收缩思路： 找到当前元素，如果是展开的，直接收缩； 如果是收缩的，获取当前元素下的所有ul标签，将所有同级元素全部隐藏，再将当...
如何用vue-Element-ui实现左侧无限级菜单？本文详细教你
QQ2352108083的博客
06-11 2124
#最近项目中,要用到element-ui的无限级分类菜单，根据角色生成不同的递归数据，查阅了网上很多资料，发现很多都不太完整并且没有很多的延伸性。 ###梳理递归数据 我们一般拿到后台的数据是：1.扁平化数据格式 2.递归式数据格式 复制代码 let arr = [ { name:小七, id:1 }, { name:小八, id:2 }, { name: 小九, id:3 } ] 我们从后台拿到的是这种扁平化处理数据，那我们实现递归菜单的话需要什
jquery版，无限下拉菜单栏，css无限级导航javascript特效
06-22
jquery版，无限下拉菜单栏，css无限级导航javascript特效
跨帧结构无限级菜单
12-10
"跨帧结构无限级菜单"就是一种实现这种功能的技术，通常用于多层导航，允许用户在不同的层级之间轻松跳转。这种菜单在处理大量子分类时特别有用，因为它可以动态展开和收起子菜单，提供清晰的视觉层次。 在描述中...
基于 Ajax 的无限级菜单
01-21
支持Form的无闪提交（方法有点笨）支持ＭＶＣ框架，即支持传统网页架构多线程并发请求（要语言支持线程）动态加载文件，只加载有用的！处理了Ajax框架臃肿的JS文件问题。采用no table的全div + css布局 ...
STM32可方便实现无限级菜单.7z
05-25
STM32可方便实现无限级菜单，这表明我们讨论的主题是关于嵌入式系统中的STM32微控制器如何构建一个可以无限扩展的菜单系统。STM32是意法半导体（STMicroelectronics）推出的基于ARM Cortex-M系列内核的微控制器，...
php无限级分类菜单类.zip
07-11
在做PHP程序时，经常会遇到设计多级菜单的编程，其实在许多的开源后台都是无限级的分类，而这些分类的数据仅仅只保存到了一个数据表里，只是用源代码进行了关联而已。而这些关联的数据并不复杂，其实一个优秀的后台设计，应该是无限的分类，这样，在进行二次开发时，不用再单独进行编程了，只要是功能一样，后台添加一个分类就可以了，这样就达到了功能共享了。
万能无限级菜单（包含水平和垂直菜单）.zip
04-01
万能无限级菜单（包含水平和垂直菜单）。这是我做站时经常用到的一个效果，稍微修改下图片或角度，就能直接使用。
JS无限级树形菜单
08-27
JS无限级树形菜单3种
基于图数据库的无限级菜单存储
u013090676的博客
11-01 1171
无限级菜单或者说无限级分类，在实际项目中比较实用，目前比较主流的设计是通过关系型数据库进行存储，通常一个表中包含id，content，fid三个字段，content是菜单的名称，id是菜单的id，而fid是该菜单的上一级菜单，一般fid为0或者1的表示顶级菜单.后台程序通过递归进行查询。但这种方法，在菜单层级比较深之后，查询以及权限控制就不是那么方便了。比如要查询一个菜单的所有子菜单以及其的层级关...
CSS实现无限级菜单
学海无涯的专栏
05-15 2398
css菜单演示#{margin:0;padding:0;border:0;}/*要定义margin属性为0px;否则下拉会居中*/body { font-family: arial, 宋体, serif; font-size:13px;}/*下拉菜单样式*/#menu { width:480px; height:24px;background:#B9D3EE}#nav {line-heig
jquery+递归自动生成无限级菜单
Logan_Su的博客
11-26 1390
由于本人对于前端实在是不怎么样，所以按钮就不制作了，只是用普通的文字表达就可以了，思路才是最重要的。 首先得引入jquery，这里我用的是jquery-1.8.2.min。代码如下： <!DOCTYPE html> <html> <head> <meta charset="GB18030"> <title>Insert title here</title> <style type="text/cs
无限子类，无限菜单的算法
BaDa.NET
09-21 862
//------------------------------------------------------------多层判断开始 string lblClassNames="";//当前类名称 string str=""; if(this.Request.QueryString["classID"]!="" && this.Request.QueryString["classID"]!=n
vue实现无限级动态菜单(非常有用)
qq_43482627的博客
10-22 3138
效果展示 主要思路 运用递归的思想，循环所有菜单。如果菜单有子菜单，则把子菜单再循环一遍，直到没有子菜单为止。 （好像说了也不太明白，那就直接看实例代码吧！） 封装菜单组件 <template> <div> <!-- 这些是样式，可自定义 --> <el-menu background-color="#f3fbfe" text-color="#3C3C3C" active-text-color="#4d94dc
7-实现无限级菜单
kismile
03-26 291
[toc] 第一种方法 数据表如下 -- ---------------------------- -- Table structure for `auth_menu` -- ---------------------------- DROP TABLE IF EXISTS `auth_menu`; CREATE TABLE `auth_menu` ( `id` int(10) unsigned...
鸿蒙语言基础类库：【@ohos.util.ArrayList (线性容器ArrayList)】
最新发布
2301_76813281的博客
07-09 916
本模块首批接口从API version 8开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。点击或者复制转到。ArrayList是一种线性数据结构，底层基于数组实现。ArrayList会根据实际需要动态调整容量，每次扩容增加50%。ArrayList和[Vector]相似，都是基于数组实现。它们都可以动态调整容量，但Vector每次扩容增加1倍。ArrayList和[LinkedList]相比，ArrayList的随机访问效率更高。
小程序实现无限级树形菜单
06-06
要实现无限级树形菜单，可以使用递归的方法。以下是一个简单的实现思路： 1. 定义一个数据结构，用于存储菜单数据，包括菜单名称、菜单ID、父级菜单ID等信息。 2. 在小程序页面中定义一个组件，用于渲染树形菜单。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值