1

我试图用expand 和 collapsetree来显示数据。JQuery 

For example my database 
Parent A has AA, AB, AC children
Parent AA has AAA, AAB, AAC
Parent AC has ACA, ACB, ACD
etc.

所以我使用递归来显示数据库中的所有数据。

但是我还需要声明 JQuery，所以我使用相同的Recursion代码来生成脚本

我想问的是，有没有办法使用递归一次来生成这两种东西？数据显示在<body>标签内，JQuery 在<head>标签处声明。

因为我觉得做同样的事情两次会浪费内存。

这是我的<body>代码

   <?   
      $temp = "";                
      $parent = "";
      $level = 0;
      loadFolders($parent, $level, $temp);

      function loadFolders($parent, $level, $temp){
        $getLevelSql = mysql_query("select * from folders where parent='$parent' and level='$level'");
        $level++;
        while ($getLevelSqlRow = mysql_fetch_array($getLevelSql)){
          $parentID = $getLevelSqlRow['id'];
          $child = $getLevelSqlRow['child'];
          $checkChild = mysql_query("select * from folders where parent='$parentID' and level='$level' ");
          if (mysql_num_rows($checkChild)){
          ?>
            <div class="level1 redFont" id="levelID<?echo $getLevelSqlRow['id'];?>">
              <?echo "$child";?>
            </div>  
            <div class="level2" id="childID<?echo $getLevelSqlRow['id'];?>">
          <?
            loadFolders($parentID, $level, $temp);
          ?>
            </div>
          <?  
          } else {
          ?>
            <div><?echo "$child";?></div>  
          <?
          }
        }
      }
    ?>

这是我的<head>代码

<script> 
    $(document).ready(function(){

    <?
      include "config.php";
      $temp = "";                
      $parent = "";
      $level = 0;
      loadFolder($parent, $level, $temp);

      function loadFolder($parent, $level, $temp){
        $getLevelSql = mysql_query("select * from folders where parent='$parent' and level='$level'");
        $level++;
        while ($getLevelSqlRow = mysql_fetch_array($getLevelSql)){
          $parentID = $getLevelSqlRow['id'];
          $child = $getLevelSqlRow['child'];
          $checkChild = mysql_query("select * from folders where parent='$parentID' and level='$level' ");
          if (mysql_num_rows($checkChild)){
          ?>
            $("#levelID<?echo $getLevelSqlRow['id'];?>").click(function(){
            $("#childID<?echo $getLevelSqlRow['id'];?>").slideToggle("slow");
          });
          <?
            loadFolder($parentID, $level, $temp);
          ?>
          <?  
          }
        }
      }
    ?>

    });
  </script>

提前致谢

4

1 回答 1

0

我没有对此进行测试，因为我没有数据可以做到这一点，但基本上你真的只需要在你的 jquery 代码中使用选择器来从任何点击点找到子部分。

我会嵌套子元素以使其更容易。像这样的东西：

   <?   
  $temp = "";                
  $parent = "";
  $level = 0;
  loadFolders($parent, $level, $temp);

  function loadFolders($parent, $level, $temp){
    $getLevelSql = mysql_query("select * from folders where parent='$parent' and level='$level'");
    $level++;
    while ($getLevelSqlRow = mysql_fetch_array($getLevelSql)){
      $parentID = $getLevelSqlRow['id'];
      $child = $getLevelSqlRow['child'];
      $checkChild = mysql_query("select * from folders where parent='$parentID' and level='$level' ");
      if (mysql_num_rows($checkChild)){
        // ** notice I've added item class and nested the children inside
      ?>
        <div class="level1 redFont item" id="levelID<?echo $getLevelSqlRow['id'];?>">
          <?echo "$child";?>
          <div class="children" id="childID<?echo $getLevelSqlRow['id'];?>">
        </div>  

      <?
        loadFolders($parentID, $level, $temp);
      ?>
        </div>
      <?  
      } else {
      ?>
        <div><?echo "$child";?></div>  
      <?
      }
    }
  }
?>

然后你的 jquery 就变成了这样：

$(document).ready(function(){

    $('div.item').click(function(){
        $(this).find('>div.children').slideToggle("slow");
    });

});

无需循环两次并生成一百个处理程序..

于 2012-11-13T02:22:38.757 回答