`
邱好东
  • 浏览: 9755 次
社区版块
存档分类
最新评论

HTML5之文件选择器

阅读更多

<!DOCTYPE html>

<html>

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <style>

       #outline {border:5px #666600 outset;padding:10px;}

    </style>

    <script src="jquery-1.10.2.min.js"></script>

    <script type="text/javascript">

       $(function(){

         $("input:file").on('change',function(event){

           for(var i=0;i<event.target.files.lenght;i++){

              $('#message').append(file.name+"<br>");

           }

         });

       })

    </script>

  </head>

  <body>

     <div id="outline">

        <h1>选择文件</h1>

           <input type="file" accept="image/*" multiple/>

           <div id="message"></div>

     </div>

  </body>

</html>

分享到:
评论

相关推荐

    基于jquery的H5移动端选择器,日期选择器,自定义级联选择器,自定义html选择器

    在提供的压缩包文件"lay-picker-master"中,我们可以推测这是一个基于jQuery的移动端选择器库,名为"lay-picker"。这个库可能包含了实现上述功能的源代码、示例、文档和其他资源。使用这个库,开发者可以快速集成到...

    前端 html5 省市区选择器

    在前端开发中,HTML5 省市区选择器是一个常见的组件,用于用户输入他们的地理位置信息。这个组件通常包括三级联动的下拉菜单,用户依次选择省份、城市和区县,以便提供精确的地址信息。在网页应用中,这种组件常见于...

    安卓HTML5文件管理器案例

    【安卓HTML5文件管理器案例】是一个将HTML5技术应用在安卓平台上的创新实践,它允许用户通过网页浏览器来操作和管理设备上的本地文件。HTML5作为一种强大的网页开发标准,其离线存储、拖放功能、媒体元素以及文件API...

    使用JavaScript实现一个本地文件选择器功能

    在JavaScript中实现一个本地文件选择器功能,是前端开发中常见的需求,这通常涉及到HTML5的File API。这个功能允许用户从他们的计算机上选择文件,并且可以进行预览、上传或者其他处理。以下将详细讲解如何实现这个...

    HTML5+CSS3 城市选择器

    如果是后者,"City"可能包含了实现这个城市选择器的所有源代码,包括HTML文件(可能有`index.html`)、CSS文件(如`styles.css`)和JavaScript文件(如`script.js`)。 总的来说,"HTML5+CSS3 城市选择器"是一个很...

    HTML5技术开发的超酷颜色选择器

    在这个项目中,“HTML5技术开发的超酷颜色选择器”利用了HTML5的新特性,创建了一个既实用又美观的颜色选取工具。下面将详细介绍这个颜色选择器涉及到的关键知识点。 1. **Canvas API** - HTML5的Canvas是用于在...

    html5手机端时间选择器

    在压缩包中,"html5手机端时间选择器"很可能包含了实现这一功能的HTML文件、CSS文件和JavaScript文件。开发者可以通过查看这些文件来学习和理解实现细节,也可以直接将它们引入自己的项目中使用。如果提供了调用示例...

    h5省市县选择器

    1. HTML文件:包含省市县选择器的HTML结构。 2. CSS文件:用于样式控制的CSS代码。 3. JavaScript文件:实现联动逻辑的JS代码,可能包括初始化选择器、事件监听和数据处理等功能。 4. 数据文件:可能是一个JSON格式...

    HTML5移动端日期选择器.zip

    HTML5移动端日期选择器是一种在移动设备上用于输入或选择日期的交互组件,它极大地提升了用户体验,特别是对于需要用户输入日期的移动应用或网站。在传统的HTML4中,日期选择通常依赖于JavaScript库或者简单的文本...

    web端 日期选择器 月份选择器 时间选择器 时间范围选择器

    本文将详细讲解"web端日期选择器、月份选择器、时间选择器以及时间范围选择器"这四个核心知识点,并结合提供的文件名称进行分析。 1. **日期选择器** 日期选择器是Web应用中常见的组件,用于让用户选择一个具体的...

    好看的h5日期选择器

    压缩包中的文件"datePicker"可能包含了该日期选择器的源码,包括HTML、CSS和JavaScript文件。通过查看这些源码,我们可以深入理解其工作原理,学习如何在自己的项目中集成和定制这样的日期选择器。 总之,“好看的h...

    html实现js文件md5

    可以使用`&lt;input type="file"&gt;`标签创建一个文件选择器,用户可以通过这个选择器选择需要计算MD5的文件。 2. **引入JavaScript库**:在HTML页面中,通过`&lt;script&gt;`标签引入jQuery.js和spark-md5.js。jQuery库可以...

    HTML5手机端日期时间选择器.zip

    这种选择器是HTML5新引入的功能之一,旨在提高Web应用程序的用户体验,特别是在移动设备上,因为传统的输入框可能在触摸屏上操作不便。 在HTML5中,`&lt;input&gt;`标签提供了`type`属性来定义不同类型的输入控件,例如`...

    html5手机移动端日期选择器代码.zip

    HTML5手机移动端日期选择器是Web开发中一个重要的交互组件,尤其在移动设备上,它为用户提供了方便的方式来输入或选择日期。这个压缩包“html5手机移动端日期选择器代码.zip”显然包含了实现这一功能的源代码。让...

    html5适合手机日期和时间选择器.zip

    在HTML5中,引入了许多新的元素、API和功能,其中之一就是日期和时间输入类型,这使得开发者能够创建更适合手机和平板电脑的交互式日期与时间选择器。 在传统的网页开发中,如果想要实现日期或时间选择功能,通常...

    安卓SD卡文件管理更新信息相关-文件选择器.zip

    【安卓SD卡文件管理更新信息相关 - 文件选择器】 在Android操作系统中,SD卡(Secure Digital Card)扮演着存储用户数据和应用缓存的重要角色。随着Android系统的不断更新,对SD卡的文件管理也经历了诸多变化,以...

    html5手机网页PDF文件阅读器插件

    HTML5手机网页PDF文件阅读器插件是一种技术解决方案,它允许用户在移动设备的Web浏览器上无缝查看PDF文档,而无需下载或安装额外的应用程序。这个插件利用HTML5的先进功能,如Canvas、SVG以及离线存储,来提供一个...

    html文件选择

    本话题聚焦于“html文件选择”,我们将探讨如何在指定文件夹下选择并处理HTML文件,以及如何通过编程实现文件操作。 首先,我们要了解如何获取指定文件夹下的文件列表。在多种编程语言中,都有相应的API或者库可以...

    一个Html版本的颜色选择器

    5. **自定义配置**:根据需要,可能还可以通过JavaScript配置颜色选择器的外观和行为,例如设置颜色模式、调整尺寸、启用/禁用透明度等。 在实际项目中,颜色选择器可以与CSS、JavaScript和其他前端技术紧密结合,...

    css的作用、3种形式、文件规划、选择器(大全)

    通过CSS,我们可以丰富HTML元素的视觉效果,改变元素的布局、颜色、字体、尺寸等属性,甚至利用伪类选择器在元素前后插入额外的内容。 CSS的使用有三种主要形式: 1. 内联样式(行内样式):通过在HTML元素的`...

Global site tag (gtag.js) - Google Analytics