用JQuery获取File input里面的数据

今天学习了用Jquery获取File input里面的数据。

我写了一个爪哇服务,用来在网页或命令行中通过表单上传文件。

在网页中使用的表单方式为multipart/form-data,在爪哇里面通过MultipartHttpServletRequest获取文件,很好用啊。

可是写命令行的小朋友捣乱,使用的表单方式为application/x-www-form-urlencoded,传的是文件内容字符串,现在可好了,爪哇里面获取不到文件了。

洽谈之后,决定将文件以字符串的方式传输,就是接下来的内容了。

首先有个表单,里面有两个input,一个用来选择文件,而另一个则用来存储读到的文件内容。

<form id="form" >
    <input type="file" name="fileTrans" />
    <input type="hidden" name="file" />
</form>

接下来检查浏览器是否支持Fie API

if (!(window.File || window.FileReader || window.FileList || window.Blob)) {
    alert('你妈喊你换Chrome浏览器啦');
}

在选择好文件之后,通过Jquery获取到文件内容

var files = $('input[name="fileTrans"]').prop('files');//获取到文件列表

if(files.length == 0){
    alert('请选择文件');
    return;
}else{
    var reader = new FileReader();//新建一个FileReader
    reader.readAsText(files[0], "UTF-8");//读取文件 
    reader.onload = function(evt){ //读取完文件之后会回来这里
        var fileString = evt.target.result;
        form.file.value = fileString; //设置隐藏input的内容
    }
}

现在提交表单,就可以通过request.getParameter("file");获取到文件内容噜。

哈库拉玛塔塔。


小朋友的爪哇岛
记录和分享小朋友学习爪哇的过程与心得
395 声望
11 粉丝
0 条评论
推荐阅读
少用 ibatis 的动态 SQL 组装
这两天在看之前一个小朋友写的作业。 这个作业是写一个类似留言板的东西。 因为留言板充其量也就三四个人访问。 所以我就索性把之前的部分缓存去掉。 这样所有的请求都直接走数据库查询。 简单的检查了一下大多数...

小朋友阅读 1.7k

Ajax实现搜索联想 搜索关键词提醒 无刷新搜索
通过javascript监听搜索框的内容,调用后端即可。(1)javascript监听搜索框的内容(2)把搜索框的关键词传给后端进行搜索(3)搜索到结果,遍历到页面

TANKING1阅读 4.4k

Promise: 异步编程的理解和使用
JavaScript 中,Promise 的流行是得益于 jQuery 的方法 jQuery.Deferred(),其他也有一些更精简独立的 Promise 库,例如:Q、When、Bluebird。

后除2阅读 775

使用原生js替换jQuery
前端发展很快,现代浏览器原生 API 已经足够好用。我们并不需要为了操作 DOM、Event 等再学习一下 jQuery 的 API。同时由于 React、Angular、Vue 等框架的流行,直接操作 DOM 不再是好的模式,jQuery 使用场景大...

donggongai1阅读 432评论 1

Y 分钟速成 jquery
jQuery是JavaScript的一个函数库,它可以帮你“写更少,做更多”。它集成了很多常见的JavaScript任务并且很容易调用。jQuery被世界各地的很多的大公司和开发者使用。它包括了AJAX,事件处理,文档操作以及很多其它...

小X学技术阅读 683

Jquery实现的Switch开关按钮(仿iOS开关)
1、swich主体switch-on 代表开启,如需设置默认关闭,可设置为 switch-off,themeColor 是主题色,zoom 可设置swich的大小,调整 zoom 的值即可调整大小。

TANKING阅读 596

封面图
Shi 山淘金,这个技术搞出来属实不易了
当一个人开始回首往事,说明他过的并不好...不排除他在摸鱼回首往事,翻看过去的Shi山,一个个简单又精致的活动H5映入眼帘,是什么让曾经手无缚鸡(撸码)之力的我,捯饬出如此精美的H5(纯属自嗨),点我审阅扫...

用户bPbJLQQ阅读 372

封面图
395 声望
11 粉丝
宣传栏