file上传图片获取路径地址

类似:点击button,选择图片,在对应的输入框input里面显示图片路径地址

类似这样

原理:通过opacity来隐藏原生的input file 然后用.file-btn来模拟input file的位置 再进行美化

file-btn 设置overflow: hidden;是为了不让超出的部分也能点击添加file

==============核心jq代码================================

$(function(){
    $(".input-file").each(function(i){
    $(".input-file").eq(i).bind('change',function(){
    $(".input-txt").eq(i).val($(this).val());
    });
    })
 })

====================================================

参考面包源码地址:http://files.cnblogs.com/files/leshao/codepen_vLeoJm.rar

修改之后列表代码:http://files.cnblogs.com/files/leshao/file%E5%88%97%E8%A1%A8%E4%B8%8A%E4%BC%A0%E5%9B%BE%E7%89%87%E8%B7%AF%E5%BE%84.rar

多谢 江华  面包 ,完善,哈哈

file上传图片获取路径地址的更多相关文章

  1. wordpress各种获取路径和URl地址的函数总结

    wordpress中的路径也不是很负责,有人为了让wordpress运行速度更快,就直接写了绝对地址,其实这样是很不好的,有可能别人修改了wordpress程序的地址,那么这样你编写的这个插件或者是主 ...

  2. JAVA中获取路径

    内容来自于snannan_268 关键字: java中获取路径 JAVA中获取路径: 1.jsp中取得路径:   以工程名为TEST为例: (1)得到包含工程名的当前页面全路径:request.get ...

  3. JavaEE 获取路径全攻略

    本篇博客是 JavaWeb 应用服务器端在不同环境下获取文件路径的全面总结. 获取文件路径后主要应用的场景,读取 JavaWeb 自定义配置文件.在特定路径下生成各种类型的文件提供下载...... 想 ...

  4. Java获取路径方法&相对路径读取xml文件方法

    (1).request.getRealPath("/");//不推荐使用获取工程的根路径 (2).request.getRealPath(request.getRequestURI ...

  5. JAVA文件中获取路径及WEB应用程序获取路径方法

    JAVA文件中获取路径及WEB应用程序获取路径方法 1. 基本概念的理解 `绝对路径`:你应用上的文件或目录在硬盘上真正的路径,如:URL.物理路径 例如: c:/xyz/test.txt代表了tes ...

  6. File中操作路径的API(转)

    这几天一直在搞Java,模板引擎系列和程序猿执业修养系列都暂停了,在Java上忙的不亦乐乎!由于对Java还不太熟悉,经历了各种纠结终于完成了任务.以下是关于Java获取当前目录的方法的备忘录. 原文 ...

  7. GetPathFromUri4kitkat【Android 4.4 kitkat以上及以下根据uri获取路径的方法】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 在Android4.4之前和之后,通过Intent调用文件管理器选择文件,获取的文件uri地址形式是不同的. Android6.0 ...

  8. java 获取路径的各种方法

    (1).request.getRealPath("/");//不推荐使用获取工程的根路径 (2).request.getRealPath(request.getRequestURI ...

  9. Java 获取路径的几种方法 - 转载

    1.获取当前类所在的“项目名路径” String rootPath = System.getProperty("user.dir"); 2.获取编译文件“jar包路径”(反射) S ...

随机推荐

  1. java学习笔记之System类

    System类常用总结 System类概述 java.lang.System类,系统属性信息工具类 常用静态方法: 1. public static long currentTimeMillis() ...

  2. 解决failed to push some refs to git

    Administrator@PC-20150110FGWU /K/cocos2d/yc (master) $ git push -u origin master To git@github.com:y ...

  3. 掌上快递 APP 项目之概述篇

    概述 学习Android开发也有一段时间了,利用业余时间独立制作的一款快递类APP软件.大概2个多星期吧,自己将其定位为"集快递信息追踪.附近快递点查询. 快递公司投诉功能为一体的便民生活类 ...

  4. Implement Queue using Stacks(用栈实现队列)

    Implement the following operations of a queue using stacks. push(x) -- Push element x to the back of ...

  5. Go语言核心之美-必读

    Go语言核心之美开篇了!.不管你是新手还是一代高人,在这个系列文章中.总能找到你想要的! 博主是计算机领域资深专家并且是英语专8水平,翻译标准仅仅有三个:精确.专业.不晦涩,为此每篇文章可能都要耗费数 ...

  6. MQTT Client library for C (MQTT客户端C语言库-paho)

    原文:http://www.eclipse.org/paho/files/mqttdoc/MQTTClient/html/index.html 来自我的CSDN博客   最近在使用Paho的MQTT客 ...

  7. 「mysql优化专题」视图应用竟然还可以这么优化?不得不收藏(8)

    一.视图概述(技术文): (1)什么是视图? 视图是基于 SQL 语句的结果集的可视化的表. 视图包含行和列,就像一个真实的表.视图中的字段就是来自一个或多个数据库中的真实的表中的字段.视图并不在数据 ...

  8. redis设置开机启动

    方式一 1.设置redis.conf中daemonize为yes,确保守护进程开启,也就是在后台可以运行.(设置为yes后,启动时好像没有redis的启动界面,不知道为什么) #vi编辑redis安装 ...

  9. 什么是JWT(JSON WEB TOKEN)

    转自于:http://www.jianshu.com/p/576dbf44b2ae 什么是JWT Json web token(JWT)是为了网络应用环境间传递声明而执行的一种基于JSON的开发标准( ...

  10. 为什么覆写equals()方法的时候总是要覆写hashcode()?

    要回答这个问题,我们应该先认识一下obj中的equals和hascode方法 1.equals()方法在obj中定义如下: public boolean equals(Object obj) { re ...