我需要显示表中的数据,每个条目都有父,我的php代码如下:
function makeArbo($array, $currentParent = 0, $currLevel = 0, $prevLevel = -1, &$result = '')
{
if (is_array($array) && count($array) > 0)
{
foreach ($array as $item)
{
if ($currentParent == $item['idParent'])
{
if ($currLevel > $prevLevel)
$result .= '<ul>';
if ($currLevel == $prevLevel)
$result .= '</li>';
$result .= '<li>'.$item['name'].'</li>';
if ($currLevel > $prevLevel)
$prevLevel = $currLevel;
$currLevel++;
makeArbo($array, $item['id'], $currLevel, $prevLevel, $result);
$currLevel--;
}
}
if ($currLevel == $prevLevel)
$result .= '</li></ul>';
return $result;
}
}
echo makeArbo($array);
?>
}
我的表格如下:
<?php
$array = array(
array(
'id' => 1,
'name' => 'Maths',
'idParent' => 0
),
array(
'id' => 2,
'name' => 'Topologie',
'idParent' => 1
),
array(
'id' => 3,
'name' => 'Algèbre',
'idParent' => 1
),
array(
'id' => 4,
'name' => 'Algèbre linéaire',
'idParent' => 3
),
array(
'id' => 5,
'name' => 'Arithmétique',
'idParent' => 3
),
array(
'id' => 6,
'name' => 'Thérorème de Bézout',
'idParent' => 5
),
array(
'id' => 7,
'name' => 'Informatique',
'idParent' => 0
),
array(
'id' => 8,
'name' => 'C-C++',
'idParent' => 7
),
array(
'id' => 9,
'name' => 'Les pointeurs',
'idParent' => 8
)
);
}
结果很完美:
<ul>
<li>Maths</li>
<ul>
<li>Topologie</li>
<li>Algèbre</li>
<ul>
<li>Algèbre linéaire</li>
<li>Arithmétique</li>
<ul>
<li>Thérorème de Bézout</li>
</ul>
</ul>
</ul>
<li>Informatique</li>
<ul>
<li>C-C++</li>
<ul>
<li>Les pointeurs</li>
</ul>
</ul>
</ul>
但我需要将此代码从php转换为javascript;
我尝试了这样的javascript代码:
function makeArbo(array,currentParent,currLevel, prevLevel, result)
{
if (typeof(currentParent)=='undefined'){
currentParent=0 ;
currLevel= 0 ;
prevLevel=-1 ;
result='';
}
if (array.length >0)
{
for (i=0;i< array.length;i++)
{
if (currentParent == array[i]['parentid'])
{
if (currLevel > prevLevel)
result += '<ul>';
if (currLevel == prevLevel)
result += '</li>';
result += '<li>'+ array[i]['name']+'</li>';
if (currLevel > prevLevel)
prevLevel = currLevel;
currLevel++;
result+=makeArbo (array,array[i]['id'], currLevel, prevLevel, result.valueOf());
currLevel--;
}
}
if (currLevel == prevLevel)
result += '</li></ul>';
return result ;
}
}
}
返回不好,我没有像我的第一个PHP代码一样的返回。我认为这是一个问题交叉引用(通过引用),因为在我的PHP代码中结果通过引用传递“&amp; $ result =''”。
有什么建议吗?
答案 0 :(得分:0)
我认为你的代码在js中因为$ array而不正确。至于js,当一个数组被传输时,它只复制数组的地址,而不是整个状态。对于状态,我的意思是数组中的当前位置,这在您的代码中是必需的。因此,每次函数makeArbo在js'部分中运行时,数组总是从其位置的第一个元素开始,这不是您所期望的。
解决方案只是将数组移到函数之外,让它成为一个全局变量,一切都会好的。
---------------------------------刚开始在这里阅读---------- -------------------------
1 Javascript don't provide associative arrays,您需要使用对象。参见
function myVar(id, name, idParent){
this.id = id;
this.name = name;
this.idParent = idParent;
}
2在Javascript中,在itselt之前没有var的变量是全局变量。参见
array = new Array(...
3相应地更换其他代码。下面的代码在我自己的服务器中作为html文件进行测试。
4此外,您应该注意返回值。使用对象来保存返回值,否则我们无法获得所需内容。最后这一切都很好,我可以去我的床上......
干杯!!
我的html文件:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph</p>
<script>
function myVar(id, name, idParent){
this.id = id;
this.name = name;
this.idParent = idParent;
}
array = new Array(
new myVar(1, "maths", 0),
new myVar(2, "Topologie", 1),
new myVar(3, "Algèbre", 1),
new myVar(4, "Algèbre linéaire", 3),
new myVar(5, "Arithmétique", 3),
new myVar(6, "Thérorème de Bézout", 5),
new myVar(7, "Informatique", 0),
new myVar(8, "C-C++", 7),
new myVar(9, "Les pointeurs", 8)
);
function run() {
var result = {};//the object to hold the values' position
result.value = "";//the real values;
document.getElementById("demo").innerHTML = makeArbo(0, 0, -1, result).value;
}
function makeArbo(currentParent , currLevel, prevLevel, result)
{
if (array.length >0)
{
for (var i = 0 ; i < array.length; i++)
{
if (currentParent == array[i].idParent)
{
if (currLevel > prevLevel)
result.value += '<ul>';
if (currLevel == prevLevel)
result.value += '</li>';
result.value += '<li>' + array[i].name + '</li>';
if (currLevel > prevLevel)
prevLevel = currLevel;
currLevel++;
makeArbo(array[i].id, currLevel, prevLevel, result);
currLevel--;
}
}
if (currLevel == prevLevel)
result.value += '</li></ul>';
return result;
}
}
window.onload = run;
</script>
</body>
</html>