截图:
 

代码:
<input type="file" id="choosefile" style="display:none"/>
<div onclick="uploadfile()" style="width:78px;height:50px;margin-left:5px;background:#00A2D4;float:left;display:block;line-height:50px;text-align:center;color:white;border-radius:3px;cursor:pointer;">选择文件</div>
<div id="filename" style="line-height:70px"></div> <script type="text/javascript">
function uploadfile(){
$("#choosefile").click(); //jquery获取input file文件名
var file = $("#choosefile").val();
var fileName = getFileName(file);
function getFileName(o){
var pos=o.lastIndexOf("\\");
return o.substring(pos+1);
}
$("#filename").html(fileName);
}
</script>
 

jquery即时获取上传文件input file文件名的更多相关文章

  1. 通过Ajax方式上传文件(input file),使用FormData进行Ajax请求

    <script type="text/jscript"> $(function () { $("#btn_uploadimg").click(fun ...

  2. 上传文件 input file

    //-----前端文件------- form id="uploadForm" enctype="multipart/form-data"> <in ...

  3. python+selenium:解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  4. IT轮子系列(四)——使用Jquery+formdata对象 上传 文件

    前言 在MVC 中文件的上传,一般都采用控件: <h2>IT轮子四——文件上传</h2> <div> <input type="file" ...

  5. JS获取上传文件的绝对路径,兼容IE和FF

    <input type="file" id="fileBrowser" name="fileBrowser" size="5 ...

  6. js获取上传文件内容(未完待续)

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

  7. PHP使用APC获取上传文件进度

    今天发现使用PHP的APC也能获取上传文件的进度.这篇文章就说下如何做. 安装APC 首先安装APC的方法和其他PHP模块的方法没什么两样,网上能找出好多 phpinfo可以看到APC的默认配置有: ...

  8. Atitit.js获取上传文件全路径

    Atitit.js获取上传文件全路径 1. 默认的value只能获取文件名..安全原因.. 1 2. Firefox浏览器的读取 1 3. Html5 的file api 2 4. 解决方法::使用a ...

  9. js获取上传文件内容

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

随机推荐

  1. node.js 调用第三方服务

    node作为客户端调用第三方服务   nodejs.cn/api 1. let http = require('http'); let util = require("util") ...

  2. hdu 1754 I Hate It (单点修改+区间最值+裸题)

    Time Limit: 9000/3000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s) ...

  3. cordova获取app版本信息插件的使用:cordova-plugin-app-version

    1. 添加插件: cordova plugin add cordova-plugin-app-version 2. 调用方法: //获取当前文件的版本号: document.addEventListe ...

  4. PythonStudy——字符串重要方法 String important method

    # 1.索引(目标字符串的索引位置) s1 = '123abc呵呵' print(s1.index('b')) # 2.去留白(默认去两端留白,也可以去指定字符) s2 = '***好 * 的 *** ...

  5. Redis 集群知识点及命令

    Redis 集群命令 备注 cluster nodes 查看集群包含的节点 cluster meet <ip> <port> 将 ip 和 port 所指定的节点添加到 nod ...

  6. 在Win10 Anaconda中安装Tensorflow

    有需要的朋友可以参考一下 1.安装Anaconda 下载:https://www.continuum.io/downloads,我用的是Python 3.5 下载完以后,安装.   安装完以后,打开A ...

  7. json 数据在textarea中显示的时候,切换 beauty和ugly模式

    转化为beauty模式 var jsonText = $('#json').val(); $('#json').val(JSON.stringify(JSON.parse(jsonText), nul ...

  8. 单源最短路径算法——Dijkstra算法(迪杰斯特拉算法)

    一 综述 Dijkstra算法(迪杰斯特拉算法)主要是用于求解有向图中单源最短路径问题.其本质是基于贪心策略的(具体见下文).其基本原理如下: (1)初始化:集合vertex_set初始为{sourc ...

  9. pytorch下的lib库 源码阅读笔记(2)

    2017年11月22日00:25:54 对lib下面的TH的大致结构基本上理解了,我阅读pytorch底层代码的目的是为了知道 python层面那个_C模块是个什么东西,底层完全黑箱的话对于理解pyt ...

  10. 20165312 2017-2018-2《Java程序设计》课程总结

    20165312 2017-2018-2<Java程序设计>课程总结 每周作业链接汇总 预备作业1:我期望的师生关系 预备作业2:C语言基础调查和java学习展望 预备作业3:Linux安 ...