//先加载插件所需要的 js 、css 文件

  1. <link href="css/fileinput.css" rel="stylesheet" type="text/css" />
  2. <script src="js/fileinput.js"type="text/javascript"></script>
  3. <script src="js/fileinput_locale_zh.js" type="text/javascript"></script>
//然后 页面上代码      
 accept="image/*"  配置这个属性 (当点击选择文件时,自动过滤不是图片类型的文件)    name="image_data[]" 此属性(多图片上传时,可以将文件属性放到一个数组中)如图所示:
注 :多图上传  要将ajax设置成  同步
 
 
 
  1. <input type="file" class="file"id="img_url1" name="image_data[]"accept="image/*" multiple>
  1. $("#img_url1").fileinput({
  2. language: 'zh',
  3. uploadUrl: "upload", //上传后台操作的方法
  4. uploadAsync: false, //设置上传同步异步 此为同步
  5. maxFileSize: 200,
  6. allowedFileExtensions: ['jpg'] //限制上传文件后缀
  7. });//初始化 后 上传插件的样子


php中方法

  1. public function upload(){
  2. if(IS_AJAX)
  3. {
  4. $images_name = '';
  5. $img_name = time();
  6. foreach($_FILES['image_data']['tmp_name'] as$k=>$v)
  7. {
  8. move_uploaded_file($v,$img_path.$img_name.$k.'.jpg');
  9. $images_name  .=  $img_name.$k.'.jpg'.',';
  10. }
  11. }
  12. return 1; //这个返回值必须要
  13. }

了解更多 请参考http://plugins.krajee.com/file-input/demo#image-management

php 应用 bootstrap-fileinput 上传文件 插件 操作的方法的更多相关文章

  1. bootstrap fileinput上传文件

    参考博客:https://blog.csdn.net/linhaiyun_ytdx/article/details/76215974  https://www.cnblogs.com/parker-y ...

  2. bootstrap fileinput 上传文件

    最近用到文件上传功能, 说实话:以前遇到过一次,COPY了别人的代码 结束! 这次又要用,可是看到别人很酷的文件上传功能,心痒了! 好吧.简单的办法,找控件: bootstrap fileinput ...

  3. .net core版 文件上传/ 支持批量上传,拖拽以及预览,bootstrap fileinput上传文件

    asp.net mvc请移步 mvc文件上传支持批量上传,拖拽以及预览,文件内容校验 本篇内容主要解决.net core中文件上传的问题  开发环境:ubuntu+vscode 1.导入所需要的包:n ...

  4. Bootstrap FileInput 上传 中文 API 整理

    Bootstrap FileInput 上传  中文 API 整理 上传插件有很多 但是公司用的就是 Bootstrap FileInput 自己就看了看  会用就行 自己都不知道每个值是干嘛用的就问 ...

  5. Uploadify 上传文件插件详解

    Uploadify 上传文件插件详解 Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.不过官方提供的实例时php版本的,本文将详细介绍Uploadify在Aspnet中 ...

  6. 项目一:第四天 1、快递员的条件分页查询-noSession,条件查询 2、快递员删除(逻辑删除) 3、基于Apache POI实现批量导入区域数据 a)Jquery OCUpload上传文件插件使用 b)Apache POI读取excel文件数据

    1. 快递员的条件分页查询-noSession,条件查询 2. 快递员删除(逻辑删除) 3. 基于Apache POI实现批量导入区域数据 a) Jquery OCUpload上传文件插件使用 b) ...

  7. 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传

    使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址  ...

  8. uploadify 上传文件插件

    今天在项目中要用到文件上传功能时,想借助Jquery方式来实现,于是想到用uploadify插件来实现.不经意间在网上看到了一遍关于这个插件的用法,写的很好.在这里就分享给大家,希望对大家有帮助.以下 ...

  9. Unable to find ‘struts.multipart.saveDir’ Struts2上传文件错误的解决方法

    Unable to find ‘struts.multipart.saveDir’ Struts2上传文件错误的解决方法 在使用struts2的项目中上传文件的时候出现了一个这样的错误: 2011-7 ...

随机推荐

  1. 华为路由器GRE配置

    1. 协议简介 gre(generic routing encapsulation,通用路由封装)协议是对某些网络层协议(如ip 和ipx)的数据报进行封装,使这些被封装的数据报能够在另一个网络层协议 ...

  2. Android开发,使用背景图(xml drawable)为view 设置边框

    Android 开发中,遇到需要设置边框的情景,使用背景图来实现,代码如下: <layer-list xmlns:android="http://schemas.android.com ...

  3. Android Studio xcode单步调试 WebRTC Android & iOS

    mac环境 如何在 Android Studio 里单步调试 WebRTC Android 的 native 代码. WebRTC 代码下载 depot tools 是 chromium 代码库管理工 ...

  4. MySQL5.5.21图解教程

    大家都知道MySQL是一款中.小型关系型数据库管理系统,很具有实用性,对于我们学习很多技术都有帮助,前几天我分别装了SQL Server 2008和Oracle 10g数据库,也用了JDBC去连接他们 ...

  5. Tomcat 的 DefaultServlet

    问题描述: 群里有人测试 Spring MVC,没有配置任何Controller,只配置了一个view resolver,指定了前缀后缀. 然后,他问的是 当访问 localhost:8080/tes ...

  6. Rethinking the inception architecture for computer vision的 paper 相关知识

    这一篇论文很不错,也很有价值;它重新思考了googLeNet的网络结构--Inception architecture,在此基础上提出了新的改进方法; 文章的一个主导目的就是:充分有效地利用compu ...

  7. css 解决父div与子div不在同一容器的问题

    <html> <head> </head> <body> <div style="margin:0 auto;width:600px;b ...

  8. C# IEnumerator的详解

    迭代器模式是设计模式中行为模式(behavioral pattern)的一个例子,他是一种简化对象间通讯的模式,也是一种非常容易理解和使用的模式.简单来说,迭代器模式使得你能够获取到序列中的所有元素而 ...

  9. 【经验之谈】Git使用之TortoiseGit配置VS详解;国内几大Git代码托管网站

    转载自: http://www.cnblogs.com/xishuai/p/3590705.html   http://www.cnblogs.com/shanyou/p/3662482.html

  10. 数据源HikariCP(多数据库的配置项)

    oracle.jdbc.type=oracle oracle.jdbc.driver=oracle.jdbc.OracleDriver oracle.jdbc.url=jdbc:oracle:thin ...