简单记录一下

效果图:

代码:

 <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. 个人JS体系完善(一)

    个人JS体系整理(一) 一. 原型 JS每声明一个Function,都有Prototype原型,Prototype原型是函数的一个默认属性,在函数的创建过程中由JS编译器自动添加,也就是说每当生产一个 ...

  2. 继承&多态

    继承: 概念: 基类,超累,父类 访问权限: Public :无限制,自由访问 Private:不可继承 protected :包内,包外,可访问,继承 default:没有指明任何权限下,默认在同一 ...

  3. Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggre

    原文链接:https://blog.csdn.net/hq091117/article/details/79065199 https://blog.csdn.net/allen_tsang/artic ...

  4. P4559 [JSOI2018]列队

    \(\color{#0066ff}{ 题目描述 }\) 作为一名大学生,九条可怜在去年参加了她人生中的最后一次军训. 军训中的一个重要项目是练习列队,为了训练学生,教官给每一个学生分配了一个休息位置. ...

  5. php 生成读取csv文件并解决中文乱码

    csv其实是文本文件,但是里面的内容是利用逗号分隔的. 1. 生成csv文件 function new_csv($arr) { $string=""; foreach ($arr ...

  6. asyncjs,waterfall的使用

    waterfall waterfall(tasks, [callback]) (多个函数依次执行,且前一个的输出为后一个的输入) 按顺序依次执行多个函数.每一个函数产生的值,都将传给下一个函数.如果中 ...

  7. [WebShow系列] 需求及环境的确定

    需求及环境确定: 主题标语 选手人数 评委人数 打分方式 合计算法 名次算法 大屏数量 大屏分辨率 电脑配置 切换设备 评委人员配备 技术人员配备 现场网速情况 评委移动端配备 场次数量 场次时间 选 ...

  8. js 遍历tree的一个例子(全遍历),更复杂的功能

    更复杂的功能 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  9. Petya and Origami

    Petya is having a party soon, and he has decided to invite his nn friends. He wants to make invitati ...

  10. 求(3+开根5) N次方的整数部分最后3位

    求(3+开根5) N次方的整数部分最后3位,请补足前导零 . 分析:首先(1)=(3+开根5) N次方的展开为 an + bn * 根号5 的形式   . 同时也有 (2)=(3-开根5) N次方 = ...