使用Javascript完成文件操作、添加新项到HTML控件SELECT中、读取SELECT控件中的选定项

最新推荐文章于 2025-11-24 03:12:01 发布
原创 最新推荐文章于 2025-11-24 03:12:01 发布 · 2.2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #html #textbox #server #asp #button

本文介绍了一种使用JavaScript和HTML实现的方案，能够获取计算机上的磁盘信息，并允许用户选择磁盘根目录来导出特定信息。通过枚举磁盘驱动器并创建下拉列表供用户选择，之后将选定位置下的userkey.txt文件写入所需信息。

    项目需要将用户的部分信息到处到客户端的指定位置上，要求具体到磁盘根目录，花了些时间做了一个界面。

    GetDiskInfo()函数用于获得盘符信息，并添加到HTML控件SELECT中。

    ExportKey()函数用于确定用户选定的位置并将信息写入该位置下的userkey.txt文件中。

 

<HTML>
    <HEAD>
        <title>导出</title>
        <script language="javascript">
            function GetDiskInfo()
            {
                var fso = new ActiveXObject("Scripting.FileSystemObject");
                var drives = fso.Drives;
                var e = new Enumerator(drives); 
                var selectInfo = document.getElementById("selectList");
                
                for(; !e.atEnd(); e.moveNext()) 
                {
                    var anOption = document.createElement("OPTION");
                    anOption.text = e.item().Path;
                    selectInfo.add(anOption);
                }
            }
            
            function ExportKey()
            {
                var key = window.document.Form1.<%=  this.UserInfoTextBox.ClientID %>.value;
                var fso = new ActiveXObject("Scripting.FileSystemObject");
                var e = new Enumerator(fso.Drives);
                var path = window.document.Form1.selectList.options[window.document.Form1.selectList.selectedIndex].text + "/userkey.txt";
                for(var i = 0; i < (window.document.Form1.selectList.selectedIndex - 1); i++)
                {
                    e.moveNext();
                }
                if(e.item().IsReady)
                {
                    f1 = fso.CreateTextFile(path, true);
                    f1.Write(key);
                    f1.Close();
                    alert("完成导出！");
                }
                else
                {
                    alert("你所选的存储位置存在问题，请重新输入！");
                }
            }
        </script>
    </HEAD>
    <body onload="GetDiskInfo();" MS_POSITIONING="GridLayout">
        <form id="Form1" method="post" runat="server">
            <FONT face="宋体">
                <SELECT id="selectList" style="Z-INDEX: 101; LEFT: 8px; WIDTH: 112px; POSITION: absolute; TOP: 8px">
                    <OPTION></OPTION>
                </SELECT>
                <INPUT onclick="ExportKey();" style="Z-INDEX: 102; LEFT: 128px; POSITION: absolute; TOP: 8px" type="button" value="导出">
                <asp:TextBox id="UserKeyTextBox" style="Z-INDEX: 103; LEFT: 136px; POSITION: absolute; TOP: 64px"
                    runat="server" Height="0px" Width="0px"></asp:TextBox></FONT></form>
    </body>
</HTML>

 

SQL0815
关注
JavaScript解析Json实现动态修改多级下拉选择列表控件Select
c12366456的专栏
08-09 5686
最终效果： 根据上级菜单所选，决定下级菜单的列表项内容 数据源 首先读取数据库中的数据得到数据，由于数据库中的数据是分散的几个二维表格，查询出来的数据是Map键值对的List集合，不能直接拿来用，需要先进行处理：一级菜单封装为String类型菜单项的List集合，二级菜单封装为键名为一级分类项名称，键值为对应二级分类项的List集合的Map。三级菜单是同二级菜单类似的Map。
Html jquery下拉select美化插件——selectFilter.js
qq_36158551的博客
09-26 1790
jQuery是一个广泛使用的JavaScript库，它简化了DOM操作、事件处理、动画以及Ajax交互，使得开发者能更高效地构建交互式网页。在本案例中，插件正是基于jQuery构建的，旨在提供一种优雅的方式来增强下拉框的视觉效果。在网页设计中，下拉选择框是常见的用户交互元素，但其默认样式往往较为单调，不能满足现代网页的美观需求。为了解决这个问题，开发者们创建了各种各样的下拉选择框美化插件，其中便是其中之一。这个插件不仅能够美化下拉选择框，还支持常用的事件处理，提升了用户体验。
通过JS动态添加html控件后,添加样式以及OnClick
ying890的专栏
10-24 3911
通过JS动态添加html控件后，如何添加样式以及OnClick
JS给<select>的<option>赋值&JS发异步请求获取后台列表
热门推荐
ljheee的博客
03-11 1万+
HTML的下拉框标签里面的各个选项option，有时候不能写死，尤其在实现多个下拉框多级联动的时候，后继的option往往需要动态添加。 动态添加option主要有2种：一是用JS添加静态数据，第二种是需要从servlet等后台获取特定的列表，再给赋值。 一、用JS添加静态数据到option 1、JS方式： var selid =document.getElementById("sltid
JS实现动态添加列表框项
lzz0098的专栏
07-14 1491
    *请选择1-3个知识点.          1213123123      2123123123      3213123213      4123213213      5213123213      6213123213                                      var addTo       = document.getElementById("add
学习在javascript中select下拉获取选中项的索引
徊忆羽菲
09-30 926
学习在javascript中select下拉获取选中项的索引
js html5 操作本地文件,h5+js实现本地文件读取和写入
weixin_39603357的博客
06-11 2790
!doctype html html lang= en head meta charset= UTF-8 title Document /title /head body input type= file id= files >写入文件HTML5中与FileReader相对应的也有一个FileWriter,FileReader可以被Chrome、FF和Safari都支持。要求一定版本以...
把省份（json数据）显示到select中
weixin_50751685的博客
07-25 789
把josn数据中全国的省份都显示到select里面
jquery控制select控件升级 datalist， fastadmin和selectpage控件（由input优化而来） selectpage默认值
论文数据分析辅导,；论文人工智能辅导 huazhongxiaosx
04-03 2198
HTML5中定义了一种input框很好看的下拉列表--datalist，然而目前它的支持性并不好(万恶的IE，好在你要渐渐退役了...)。于是最近更据需求写了一个小型datalist插件，兼容到IE8(IE7应该没多少人用了吧？)。实现的具体需求如下: 当被选中的时候(触发blur焦点)(不管是鼠标还是tab键)清空input框并且显示自定义的下拉列表,然后可以用键盘的上下键选择(鼠标当然肯定没理由不可以啦)，单击鼠标左键或者enter键将选中的列表的值输入到input框。 ...
JavaScript用select实现日期控件
10-23
3. 日期控件逻辑实现：日期控件的逻辑实现主要通过JavaScript函数来完成，如init()函数用于初始化select控件的option，swap_day()函数根据用户选择的年份和月份动态更新日期选项。同时，数组month_big和month_small...
【ASP.NET编程知识】在ASP.NET 2.0中操作数据之五十：为GridView控件添加Checkbox.docx
05-21
在ASP.NET 2.0中，GridView控件是用于展示数据的强大工具，它可以方便地进行数据...在实际应用中，可以根据具体需求进行更多的定制，例如添加Ajax支持以实现无刷新操作，或者使用jQuery等JavaScript库来优化用户体验。
深入解析JavaScript中Select控件的实用用法
##### 使用Select控件框架 对于复杂的表单或应用，可以使用成熟的JavaScript框架如jQuery UI、Bootstrap等来简化Select的用法，并提供更美观的UI效果和更多的配置选项。 例如，jQuery UI中的`<selectmenu>`可以实现...
深入解析select控件的用法及样式定制技巧
例如，可以监听`<select>`控件的`input`事件，并在没有匹配选项时动态地添加一个新`<option>`。 ```javascript select.addEventListener('input', function() { var inputVal = select.value.trim(); if (input...
Vue开发工具使用技巧
2509_93946471的博客
11-24 276
打开DevTools的"Events"标签页，所有组件间传递的事件都会按时间顺序列出来，连事件负载数据都能展开看详情。更绝的是，你还能手动触发事件——比如在父组件里模拟一个事件，直接测试子组件的响应逻辑，省得反复修改代码来调试。如果组件用了作用域插槽，可以在"Scoped Slots"子面板里实时查看slot传递的数据内容，比在模板里写调试代码清爽得多。路由调试经常被忽略。热重载调试时，如果发现修改代码后页面没及时更新，可以到DevTools的"Settings"里勾选"Log reloads"选项。
【基础】EGG.js 框架内置基础对象
林见鹿鸣
11-24 710
在。
SSM企业物资管理系统h3109(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上，文末可获取，系统界面在最后面
2509_93102542的博客
11-21 765
在技术实现上，国外多采用成熟的开发框架和技术架构，注重系统的安全性、稳定性和可扩展性，同时积极融入大数据、人工智能等新技术，实现物资需求预测、智能库存优化等功能。基于此，开发一套基于SSM框架的企业物资管理系统，整合部门、员工、物资及各类业务流程管理功能，实现物资管理的数字化、规范化和高效化，成为解决企业物资管理痛点的必然需求。本课题旨在开发一套基于SSM框架的企业物资管理系统，围绕部门、员工、物资信息、物资申请、消息提醒、物资归还、物资入库、意见反馈八大核心功能模块，实现企业物资管理的全流程数字化。
Vue3的生命周期
分享学习网络的点点滴滴
11-21 132
Vue3生命周期详解：从创建到卸载的全过程 Vue3的生命周期分为四个主要阶段：创建、更新、卸载和错误处理。创建阶段包含setup()、onBeforeMount()和onMounted()；更新阶段有onBeforeUpdate()和onUpdated()；卸载阶段包括onBeforeUnmount()和onUnmounted()。setup()替代了Vue2的初始化阶段，是组合式API的入口。子组件的生命周期会先于父组件执行。错误处理可使用onErrorCaptured()捕获和阻止错误传播。这些钩子函
Vue网站
最新发布
2509_93947362的博客
11-24 177
给大家分享个实用技巧：组件通信时，简单的父子传参用props/$emit搞定，复杂场景就用Vuex，千万别为了省事滥用event bus，不然项目大了事件流会乱成麻花。以前写数据绑定总要搞一堆繁琐的DOM操作，现在一个双大括号{{data}}就能搞定，新手看了五分钟就能上手写页面。刚开始觉得小项目用Vuex太重量级，后来发现即便是最简单的购物车功能，随着业务复杂度的提升，最终还是得引入状态管理。特别是把相同业务逻辑抽离成composable函数后，在不同组件里直接引入就能用，代码复用率明显提升。
React社区
2509_93942966的博客
11-23 278
这种混乱中带着生命力的讨论，特别像早年中关村攒机市场——商家喊着不同配置的优劣，而真正懂行的玩家早就摸清了哪个方案最适合自己的项目。但有意思的是，无论工具链怎么变，React核心团队始终稳如老狗——他们宁可把并发特性在实验阶段晾三年，也不愿重蹈Angular断代升级的覆辙。组件库生态更是百花齐放。这种带着口音的技术交流，反而比标准教科书更能体现社区的活力。或许某天你写在Stack Overflow的答案，就会成为某个巴西程序员解决线上故障的关键——这种跨越时区的知识接力，才是技术社区最浪漫的部分。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值