简单记录一下

效果图:

代码:

 <input class="aload" type='button' value='上传附件' onClick='javascript:$("#hiddenFile").click();' />
<input id='showFileName' type='text' readonly style="border: none;"/>&nbsp;&nbsp;
<input id='hiddenFile' type='file' style="display:none" onchange='ophiddenFile();' />

js code:

 function ophiddenFile() {
var dd = $("#hiddenFile").val().split("\\");
$("#showFileName").val(dd[dd.length - 1]);
}

自定义input文件上传 file的提示文字及样式的更多相关文章

  1. 自定义input文件上传样式

    前言 文件上传是我们经常会用到的功能,但是原生的input样式太丑了,能不能自定义一个input文件上传样式呢?我这里写了两种方法,form表单提交跟ajax异步提交都没有问题,自动上传或者点击上传按 ...

  2. input文件上传(上传单个文件/多选文件/文件夹、拖拽上传、分片上传)

    //上传单个/多个文件 <input title="点击选择文件" id="h5Input1" multiple="" accept= ...

  3. SpringBoot文件上传异常之提示The temporary upload location xxx is not valid

    原文: 一灰灰Blog之Spring系列教程文件上传异常原理分析 SpringBoot搭建的应用,一直工作得好好的,突然发现上传文件失败,提示org.springframework.web.multi ...

  4. 《Play for Java》学习笔记(六)文件上传file upload

    一. Play中标准方法 使用表单form和multipart/form-data的content-type类型. 1.Form @form(action = routes.Application.u ...

  5. input 文件上传

    <button class="blueButton fileinput-button" style="width:165px;" @click=" ...

  6. Retrofit的文件上传和进度提示

    2019独角兽企业重金招聘Python工程师标准>>> 1.写一个上传监听的接口: /** * Created by Zzm丶Fiona on 2017/7/31. */ publi ...

  7. 自定义ExtJS文件上传

    日常工作中,一般文件上传都是跟随表单一起提交的,但是遇到form表单中有许多地方有文件上传时这种方式却不是很适用,以下是我工作中用的文件上传方式: { xtype: 'fileuploadfield' ...

  8. Django处理文件上传File Uploads

    HttpRequest.FILES 表单上传的文件对象存储在类字典对象request.FILES中,表单格式需为multipart/form-data <form enctype="m ...

  9. 自定义WordPress文件上传路径

    自WordPress 3.5版本开始,隐藏了后台媒体设置页面的“默认上传路径和文件的完整URL地址”选项,可以通过下面的代码将该选项调出来. 将下面的代码添加到当前主题functions.php文件中 ...

随机推荐

  1. centos7.4版本安装nmon监控软件

    一.检查安装环境 # uname –a (查看操作系统信息,所检查服务器为64位操作系统) Linux iZ94pmb2p24Z 2.6.32-431.23.3.el6.x86_64 #1 SMP T ...

  2. 运维利器:钉钉机器人脚本告警(Linux Shell 篇)

    写在前面的话 目前换了几家公司,且最近几家都是以钉钉作为公司 OA 聊天工具,总的来说还是很不错的.最近去了新公司,由于公司以前没有运维,所以监控,做自动化等方面都没有实施,恰逢这个机会把最近做的关于 ...

  3. Binder学习笔记(六)—— binder服务端是如何组织addService数据的

    在checkService的调查中我们知道客户端向ServiceManager请求服务名,ServiceManager根据服务名遍历本地链表,找到匹配的handle返回给客户端.这个handle显然是 ...

  4. loj #2037. 「SHOI2015」脑洞治疗仪

    #2037. 「SHOI2015」脑洞治疗仪   题目描述 曾经发明了自动刷题机的发明家 SHTSC 又公开了他的新发明:脑洞治疗仪——一种可以治疗他因为发明而日益增大的脑洞的神秘装置. 为了简单起见 ...

  5. spoj Longest Common Substring

    Longest Common Substring SPOJ - LCS 题意:求两个串的最长公共子串 /* 对一个串建立后缀自动机,用另一个串上去匹配 */ #include<iostream& ...

  6. UDP socket

    1.Udp :User Datagram Protocol(Udp)用户数据报文协议. 2.适用于局域网的主机间通信. 3.使用方法 1:创建Socket OS_Socket local(127.0. ...

  7. mybatis主键返回语句 使用方法,就是实体类.getid即可拿到返回的id

    <insert id="insertSelective" parameterType="com.o2o.Content" useGeneratedKeys ...

  8. vue项目中使用了vw适配方案,引入第三方ui框架mint-ui时,适配问题解决

    问题分析: 一般第三方ui框架用的都是不同的适配方式,如果我们使用了vw适配,那么在使用mint-ui框架时,就会发现px单位会被转换成vw,从而导致样式变小的问题,如图 解决方案 网上看到了很多种解 ...

  9. Spring 配置RMI远程调用

    项目中遇到了跨系统调用,当初想的是用webservice或者是hessian.但是这个接口用到的并不多,而且是一个非常简单的方法.所有便想到了RMI.在spring中 实现RMI非常简单. 暴露服务: ...

  10. svg 日常操作

    创建svg 文件 <svg> </svg> 详解viewBox  SVG Viewport.View Box和preserveAspectRatio 形状  标签内的值可以是百 ...