截图:
 

代码:
<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. 会话的保持和form表单

    会话的保持和form表单 cookie 设置cookie from django.shortcuts import render, HttpResponse, redirect, reverse de ...

  2. 学习笔记TF036:实现Bidirectional LSTM Classifier

    双向循环神经网络(Bidirectional Recurrent Neural Networks,Bi-RNN),Schuster.Paliwal,1997年首次提出,和LSTM同年.Bi-RNN,增 ...

  3. 小程序https请求,http网站升到https

    最近开发小程序,因为以前只写过小程序的前端没注意接口,现在才发现原来所有的接口都必须使用https协议了,马上研究了一波,顺便也想给自己的博客升成https的. 申请免费证书 哈哈没办法就是喜欢免费的 ...

  4. Git和Svn对比

    From: https://wenku.baidu.com/view/1f090e2e7275a417866fb84ae45c3b3567ecdd12.html Git和Svn对比   共享文档   ...

  5. mysqli字符编码

    mysqli 字符编码: 汉字编码: 1.gbk 最久的编码格式,不能写繁体: 2.国内的gb2312: 3.国际的标准:utf-8; 查看数据库的字符编码: show variables like ...

  6. gradle重复依赖终极方案解决办法

    buildscript { repositories { google() jcenter() } dependencies { classpath 'com.android.tools.build: ...

  7. Jobs深入学习

    代码回顾 Quartz 需要了解你可能希望该作业的实例拥有的各种属性,这是通过JobDetail 类完成的.  JobDetail 实例是使用 JobBuilder 类构建的. JobDetail j ...

  8. C#获取当前路径的七种方法

    //1.获取模块的完整路径. string path1 = System.Diagnostics.Process.GetCurrentProcess().MainModule.FileName; // ...

  9. (转)EF5+SQLserver2012迁移到EF6+mysql5.5.47

    原文地址:https://www.cnblogs.com/tinyjian/p/6235014.html:https://www.cnblogs.com/tinyjian/p/6235397.html ...

  10. 剑指offer题目解答合集(C++版)

    数组中重复的数字 二维数组中查找 字符串 替换空格 二叉树的编码和解码 从尾到头打印链表 重建二叉树 二叉树的下一个节点 2个栈实现队列 斐波那契数列 旋转数字 矩阵中的路径 机器人的运动范围 剪绳子 ...