UDN-企业互联网技术人气社区

板块导航

浏览  : 837
回复  : 4

[原生js] 点击按钮弹出上传文件的窗口

[复制链接]
htmlman的头像 楼主
发表于 2017-1-2 15:39:11 | 显示全部楼层 |阅读模式
  点击按钮弹出上传文件的窗口

  1.详细描述

  在页面上设置一个“选择文件”按钮,点击该按钮,会弹出本地磁盘信息用于选择文件。

  2.代码
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Demo</title>
  6. <script type="text/JavaScript">
  7. function F_Open_dialog()
  8. {
  9. document.getElementById("btn_file").click();
  10. }

  11. </script>
  12. </head>
  13. <body>
  14. <div>
  15. <input type="file" id="btn_file" style="display:none">
  16. <button type="button" onclick="F_Open_dialog()">选择文件</button>
  17. </div>

  18. </body>
  19. </html>
复制代码

  3.操作示例

  将代码复制到W3CSchool的测试页面,提交运行之后如图:在查看结果页面会出现“选择文件”这个按钮

  选择文件
2.png

  3.操作示例

  将代码复制到W3CSchool的测试页面,提交运行之后如图:在查看结果页面会出现“选择文件”这个按钮
1.png




  之后点击“选择文件”后如图:页面上会出现弹窗,显示本地磁盘信息,用于选择文件。

相关帖子

发表于 2017-1-2 15:39:44 来自手机 | 显示全部楼层
占坑编辑ing
使用道具 举报

回复

发表于 2017-1-2 15:39:44 | 显示全部楼层
JavaScript依赖于浏览器本身,与操作环境无关,只要计算机能运行浏览器,并支持JavaScript的浏览器,就可正确执行,从而实现了“编写一次,走遍天下”的梦想。
使用道具 举报

回复

发表于 2017-1-2 15:39:44 | 显示全部楼层
我是被标题吸引进来的
使用道具 举报

回复

发表于 2017-1-2 15:39:45 | 显示全部楼层
感觉JavaScript很有前途
使用道具 举报

回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们
联系我们
  • 电话:010-86393388
  • 邮件:udn@yonyou.com
  • 地址:北京市海淀区北清路68号
移动客户端下载
关注我们
  • 微信公众号:yonyouudn
  • 扫描右侧二维码关注我们
  • 专注企业互联网的技术社区
版权所有:用友网络科技股份有限公司82041 京ICP备05007539号-11 京公网网备安1101080209224 Powered by Discuz!
快速回复 返回列表 返回顶部