1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
| <?php // © Jérome Réaux : http://j-reaux.developpez.com - https://www.jerome-reaux-creations.fr
// -----------------------------
// Explorateur de dossier / fichiers
function explore_dir_scan_html($dir, $niv=0, $id=0)
{
$html = null;
$html_dirs = null;
$html_fils = null;
if($niv==0){ $html .= ' <ul>'."\n"; }
if ($handle = opendir($dir)) {
while (false !== ($entry = readdir($handle))) {
$id++;
if(is_dir($dir.'/'.$entry)) // dossier
{
if($entry!='..' && $entry!='.')
{
$html_dirs .= str_repeat("\t",$niv+1).'<li class="dir" id="div_'.$id.'">'.utf8_encode($entry)."\n";
$html_dirs .= str_repeat("\t",$niv+2).'<ul class="sub_dir" id="sub_'.$id.'">'."\n";
$html_dirs .= explore_dir_scan_html($dir.'/'.$entry, $niv+1, $id);
}
} else { // fichier
$html_fils .= str_repeat("\t",$niv+2).'<li class="fil" id="fil_'.$id.'"><a href="'.$dir.$entry.'" target="_blank">'.utf8_encode($entry).'</a></li>'."\n";
}
if(is_dir($dir.'/'.$entry))
{
if($entry!='..' && $entry!='.')
{
$html_dirs .= str_repeat("\t",$niv+2).'</ul>'."\n";
$html_dirs .= str_repeat("\t",$niv+1).'</li>'."\n";
}
}
}
closedir($handle);
$html .= $html_dirs; // dossiers
$html .= $html_fils; // fichiers
}
if($niv==0){ $html .= ' </ul>'."\n"; }
return $html;
};
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
// -------------------------------
// OUVRIR / FERMER les DOSSIERS
// En JavaScript pur (SANS jQuery)
window.onload = function() {
var explorateur_dirs = document.querySelectorAll('#explorateur-dossier .dir');
for( index=0; index < explorateur_dirs.length; index++ )
{
explorateur_dirs[index].addEventListener('click', function(ev){ opencloseSubDir(this); ev.stopPropagation(); }, false);
}
};
function opencloseSubDir( dossier )
{
var ul = dossier.querySelector('ul');
ul.style.display = (ul.style.display!='block')? 'block':'none';
}
</script>
<!-- ou AVEC jQuery -->
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> -->
<script>
/*
// -------------------------------
// OUVRIR / FERMER les DOSSIERS
// AVEC jQuery
$(document).ready(function(){
$('#explorateur-dossier').on('click', '.dir', function(event){
$(this).find('ul').first().slideToggle();
event.stopPropagation(); // important
});
});
*/
</script>
<style>
#explorateur-dossier ul { margin:0; padding:0; list-style:none outside none; }
#explorateur-dossier .dir { position:relative; padding-left:20px; cursor:pointer; border:solid 0px #00FF00; }
#explorateur-dossier .sub_dir { position:relative; padding-left:20px; cursor:pointer; display:none; border:solid 0px #FF0000;; }
#explorateur-dossier .fil { position:relative; padding-left:20px; }
#explorateur-dossier .dir:before { position:absolute; content:''; display:block; width:16px; height:16px; top:2px; left:0; background:url(images/folder.png) no-repeat; }
#explorateur-dossier .fil:before { position:absolute; content:''; display:block; width:16px; height:16px; top:2px; left:0; background:url(images/file.png) no-repeat; }
</style>
</head>
<body>
<nav id="explorateur-dossier">
<?php echo explore_dir_scan_html("../"); ?>
</nav>
</body>
</html> |
Ouverture de dossier avec opendir
Répondre avec citation
Partager