<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<div id='tree'></div>
<script language="JavaScript">
<!--
var FolderTree = function() {
var ft = this;
// 文件夹图标，分别在树展开和关闭时显示
this.driveImage = new Array("+","-");
// 要呈现树的容器ID
this.containerId = '';
// 初始化是否ok
this.show = true;
this.init = function(treeIcon,containerId) {
if (treeIcon!= null && ! typeof(treeIcon) == Array) {
alert("文件夹树形图标是一个数组，包含树展开和关闭，请确认！");
this.show = false;
}
if (treeIcon != null) {
this.driveImage = treeIcon;
}
if (containerId != null) {
this.containerId = containerId;
}
this.makeFolderTree();
},
// 在指定的容器展现树
this.makeFolderTree = function() {
if (this.show) {
var fso, s, n, e, x;
var ul = "<ul id='drivelist'>";
fso = new ActiveXObject("Scripting.FileSystemObject");
e = new Enumerator(fso.Drives);
for (; !e.atEnd(); e.moveNext())
{
ul += "<li style='list-style:none;'><span onclick='ft.liMouseClick(this);'>"+this.driveImage[0]+"</span><span>"+e.item()+"</span><input type=checkbox name='dir' value='"+e.item()+"' onclick='ft.checkConfirmOneSelected();'></li>";
}
ul += "</ul>";
if (this.containerId == '') {
document.body.innerHTML = ul;
}
else {
document.getElementById(this.containerId).innerHTML = ul;
}
}
},
// 单击节点时，获取子目录并展现
this.liMouseClick = function(o) {
o = o.parentElement;
var s1 = o.childNodes[0].innerHTML.toLowerCase() ;
s1 = s1.substring(s1.lastIndexOf('/')+1,s1.length-2);
var s2 = this.driveImage[0];
s2 = s2.substring(s2.lastIndexOf('/')+1,s2.length-2);
if (s1 == s2)
{
// 单击+号时，先判断是否已经单击过，未单击过才列出它的子目录。
if (o.childNodes.length <= 3) //1个span(+,-),1个span(目录),1个checkbox
{
// 获取子目录和文件
// 根目录
var rootFolder = o.childNodes[1].innerText + "\\";
var fso = new ActiveXObject("Scripting.FileSystemObject");
var folder = fso.GetFolder(rootFolder);
var ul = "<ul>";
// 列出子目录
fc = new Enumerator(folder.SubFolders);
for (; !fc.atEnd(); fc.moveNext())
{
var li = "<li style='list-style:none;'><span onclick='ft.liMouseClick(this);'>"+this.driveImage[0]+"</span><span>"+fc.item()+"</span><input type=checkbox name='dir' value='"+fc.item()+"' onclick='ft.checkConfirmOneSelected();'></li>";
ul += li;
}
//fc = new Enumerator(folder.files);
// 列出目录下的文件
// for (; !fc.atEnd(); fc.moveNext())
// {
// var li = "<li style='list-style:none;' onclick='liMouseClick(this);'><span>"+driveImage[0]+"</span><span>"+fc.item()+"</span></li>";
// ul += li;
// }
ul += "</ul>";
o.innerHTML = o.innerHTML + ul;
}
o.childNodes[0].innerHTML = this.driveImage[1];
}
else {
for (var i=3;i<o.childNodes.length ;i++ )
{
o.removeChild(o.childNodes[i]);
}
o.childNodes[0].innerHTML = this.driveImage[0];
}
},
// 保证只能选择一个目录
this.checkConfirmOneSelected = function() {
var checkboxs = document.getElementsByTagName('input');
var index = 0;
for (var i=0;i<checkboxs.length ;i++ )
{
if (checkboxs[i].type == 'checkbox')
{
if (checkboxs[i].checked)
{
index++;
}
}
}
if (index > 1)
{
alert('请选择一个文件夹！');
return;
}
},
// 返回选择的目录
this.showSelectedFolder = function() {
this.checkConfirmOneSelected();
var checkboxs = document.getElementsByTagName('input');
var selectedFolderString = '';
for (var i=0;i<checkboxs.length ;i++ )
{
if (checkboxs[i].type == 'checkbox')
{
if (checkboxs[i].checked)
{
selectedFolderString = checkboxs[i].parentElement.childNodes[1].innerText;
break;
}
}
}
/*if (selectedFolderString != '')
{
alert('选择的文件夹是：' + selectedFolderString);
}
else {
alert('未选择文件夹');
}*/
return(selectedFolderString);
}
}
// var ft = new FolderTree(10,10);
// ft.alert();
var ft = new FolderTree();
ft.init(new Array("<img src='D:/qincidong/books/ext/ext-2.3.0/ext-2.3.0/resources/images/default/tree/folder.gif'>","<img src='D:/qincidong/books/ext/ext-2.3.0/ext-2.3.0/resources/images/default/tree/folder-open.gif'>"),'tree');
//-->
</script>
</body>
</html>
分享到：
相关推荐
在本文中，我们将探讨如何利用JavaScript（JS）与ActiveX技术在网页中实现一个本地目录路径选择对话框。ActiveX是Microsoft开发的一种技术，允许Web应用程序访问和控制客户端的资源，如文件系统、硬件设备等。然而，...
这篇文章“js 文件夹选择框（三）”可能探讨了如何在JavaScript环境下实现类似功能的方法。 首先，我们需要了解，通常在Web应用中，`<input type="file">`元素只能让用户选择单个文件或一组文件，但不能选择整个...
ATL ActiveX OpenGL JavaScript 是一个技术组合，用于在网页中集成3D图形渲染，通过JavaScript调用由ATL（Active Template Library）创建的ActiveX控件来实现OpenGL的功能。ATL是微软提供的一种C++库，它简化了COM...
在这段内容中，我们首先要关注的是如何使用JavaScript（js）来浏览本地文件夹系统。这一过程涉及到了旧版的ActiveX对象，而这种技术多见于早期的IE浏览器中，现代的浏览器已经不再支持ActiveX控件了。 知识点一：...
JavaScript本身并不支持直接创建文件选择器或者保存对话框，但可以通过ActiveX对象（仅限IE浏览器）实现这一功能。本文将详细介绍如何利用JavaScript结合ActiveX对象实现弹出保存对话框的功能。 #### 二、关键代码...
总结来说，JavaScript虽然受限于浏览器的安全策略，但结合HTML5的File API和特定的库，如Zip.js和JSZip，可以实现文件和文件夹的压缩与解压缩功能。开发者应当熟悉这些库的使用，并注意处理用户数据时的安全性问题，...
在客户端，除了使用ActiveX对象，还可以通过其他技术手段实现文件存在性的判断，例如利用HTML5的File API来实现。而服务器端的方法则更多依赖于后端语言（如PHP, Python, Node.js等）提供的功能来完成。例如，在Node...
实现这个功能的关键技术是ActiveX控件或者WebBrowser控件，这是微软提供的一种能够在Windows应用程序中嵌入Web内容的组件。在VC项目中，可以将WebBrowser控件添加到对话框或窗口上，然后加载HTML页面作为界面。HTML...
要实现这些功能，JavaScript通常依赖于浏览器的File API或者使用服务器端脚本语言如Node.js。在浏览器环境中，由于安全限制，直接读写用户的本地文件系统受到限制，但通过一些技术手段（如HTML5拖放API）或者特定的...
在IT领域，特别是Web开发中，从服务器下载文件到客户端是一项常见的需求，涉及到的技术和方法多样，其中JavaScript（简称JS）作为前端开发的核心语言之一，提供了多种方式来实现这一功能。根据给定的文件信息，我们...
在IT行业中，兼容性问题始终是一个...同时，压缩包内的"tu.html"可能是实现这一功能的示例代码，"新建文件夹"可能是包含其他辅助资源的目录。通过分析这些文件，你可以深入理解如何解决跨浏览器的本地图片预览问题。
在本文中，我们将深入探讨如何利用`CHtmlView`类在MFC（Microsoft Foundation Classes）框架下实现对话框与HTML（包括JavaScript）的交互。`CHtmlView`是MFC中的一个类，它封装了Internet Explorer（IE）的...
3. **ADO (ActiveX Data Objects)**: 用于连接数据库，实现数据的读写操作。 4. **IIS (Internet Information Services)**: 微软提供的Web服务器解决方案，用于部署ASP应用程序。 5. **SQL Server**: 数据库管理系统...
在VB6.0中，开发者可能利用ActiveX控件或者WebBrowser控件与HTML页面交互，实现某些特定功能，比如显示关于如何更改壁纸的说明或提供一个用户界面来完成这个任务。 3. change_wallpaper.js：这是一个JavaScript文件...
JScript则与JavaScript类似，但它是Microsoft的实现，主要用于服务器端。 4. **服务器控件**：ASP提供了多种服务器控件，如Label、TextBox、Button等，它们可以在服务器端处理用户交互，增强网页的功能。 5. **...
在IT领域，尤其是在Web开发中，JavaScript（简称js）和JavaServer Pages（简称jsp）是两种常见的编程语言，用于创建动态交互式的网页。在本文中，我们将探讨如何使用JavaScript和JSP来调用系统的目录，并了解相关的...
标题中的"javascript显示选择目录对话框的代码"就是关于在IE中利用ActiveX对象`Shell.Application`来打开一个选择目录的对话框。 描述中提供的代码段就是一个示例，用于展示如何在IE浏览器中创建一个选择目录的...
- **js**：JavaScript文件夹，通常包含与页面交互、验证用户输入、处理表单提交等功能有关的脚本。 - **fonts**：字体文件，可能包含了自定义字体，用于提供特定的视觉效果。 - **css**：CSS文件，用于定义页面样式...
122.利用组件实现复杂上传功能 123.利用Stream读取显示文件 123.利用Stream上传文件 124.计算下载一个文件需要多长时间 第8章 表单与页面显示 127.如何处理单个网页中多个表单的提交 128.如何防止表单被多次提交 ...