传照片

jQuery插件AjaxFileUpload实现ajax文件上传

自古美人都是妖i 提交于 2019-12-05 06:02:35
1、引入AjaxFileUpload插件相关的js <script type="text/javascript" src="<%=basePath%>resources/js/jquery-1.2.1.js"></script> <script type="text/javascript" src="<%=basePath%>resources/js/ajaxfileupload.js"></script> 备注:测试发现,ajaxfileupload对jQuery版本是有要求的,在使用中ajaxfileupload和jQuery对应的js版本要一致,不然会导致异常发生,可以从 ajaxfileupload官网下载 ,避免版本冲突。 2、实现上传功能代码 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ include file="/base.jsp" %> <%String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%> <!DOCTYPE HTML

KindEditor完全复制word内容

折月煮酒 提交于 2019-12-05 04:33:34
我司需要做一个需求 , 就是使用富文本编辑器时 , 不要以上传附件的形式上传图片 , 而是以复制粘贴的形式上传图片 . 在网上找了一下 , 有一个插件支持这个功能。 WordPaster 安装方式如下 : 直接使用WordPaster.exe安装即可 然后在 http://blog.ncmem.com/wordpress/2019/08/12/ueditor批量上传word图片/ 里面有详细的教程 效果: Word 文档中的图片全部自动上传到服务器端,不再需要一张张手动转存操作,大幅度提高操作效率: 自动替换编辑器中的图片地址: 所有图片在上传成功后图片地址都会被自动替换成服务器的图片地址。 在上传多张图片时非常方便,也非常高效。 图片保存路径,图片上传成功后已经自动保存到服务器端。 来源: https://www.cnblogs.com/songsu/p/11906130.html

图片上传

半世苍凉 提交于 2019-12-05 04:22:24
略有瑕疵,凑合能用,先当个笔记了,以后有更好的再换。 css 1 <style> 2 /*外层div*/ 3 .input-file-box{ 4 border: 1px solid gray; 5 width: 5rem; 6 height: 5rem; 7 margin-left:.5rem; 8 position: relative; 9 text-align: center; 10 border-radius: 1rem; 11 } 12 /*文字描述*/ 13 .input-file-box > span{ 14 display: block; 15 width: 3rem; 16 height: 1rem; 17 position: absolute; 18 top: 1rem; 19 bottom: 0; 20 left: 1rem; 21 right: 0; 22 /* margin: auto; */ 23 color: gray; 24 } 25 /*input框*/ 26 .input-file-box #uploadfile{ 27 opacity: 0; 28 width: 5rem; 29 height: 5rem; 30 cursor: pointer; 31 } 32 33 .tu{ 34 /* background:yellow; */ 35 }

ant-design-vue 上传图片组件

微笑、不失礼 提交于 2019-12-05 02:53:38
<a-upload name="multipartFile" listType="picture-card" class="avatar-uploader" :showUploadList="false" action="自己的api" headers="{token:'token值'}" :beforeUpload="beforeUpload" @change="handleFrontImgChange"> <a-popover v-if="idCardFront" placement="top"> <template slot="content"> <img style="width:100%" :src="idCardFront" alt="正面" /> </template> <a-icon v-if="loadingFront" type="loading" /> <img v-else style="width:100%" :src="idCardFront" alt="正面" /> </a-popover> <div v-else> <a-icon :type="loadingFront ? 'loading' : 'plus'" /> <div class="ant-upload-text">上传</div> </div> </a-upload>   

ssm图片上传到数据库

|▌冷眼眸甩不掉的悲伤 提交于 2019-12-05 02:29:49
页面 <li> <span>当前头像:</span> <!-- <img src="./images/user-lg.png" alt=""> --> <img style="width:100px;height:100px" th:src="@{/headImg?id=} + ${session.member.id}" onerror="defaultImg(this)"/> <!-- <img th:value="${session.member.headImg}" > --> <div style="float:center;margin-left:140px"> <form action="/saveImg" method="post" enctype ="multipart/form-data"> <label for="file" class="btn btn-primary" style="float: left;height: 30px;width: 100px;margin-right: 20px">选择照片</label> <input id="file" name="file" type="file" style="float: left;display:none"/> <input name="id" type="hidden" th:value="$

Plupload上传插件中文帮助文档

一世执手 提交于 2019-12-05 02:25:43
配置参数 实例化一个plupload对象时,也就是 new plupload.Uploader() ,需要传入一个对象作为配置参数。后面内容中出现的plupload实例均是指 new plupload.Uploader() 得到的实例对象 属性 类型 默认值 描述 browse_button String / DOM 触发文件选择对话框的DOM元素,当点击该元素后便后弹出文件选择对话框。该值可以是DOM元素对象本身,也可以是该DOM元素的id url String 服务器端接收和处理上传文件的脚本地址,可以是相对路径(相对于当前调用Plupload的文档),也可以是绝对路径 filters Object { } 可以使用该参数来限制上传文件的类型,大小等,该参数以对象的形式传入,它包括三个属性: mime_types: 用来限定上传文件的类型,为一个数组,该数组的每个元素又是一个对象,该对象有title和extensions两个属性,title为该过滤器的名称,extensions为文件扩展名,有多个时用逗号隔开。该属性默认为一个空数组,即不做限制。 max_file_size: 用来限定上传文件的大小,如果文件体积超过了该值,则不能被选取。值可以为一个数字,单位为b,也可以是一个字符串,由数字和单位组成,如’200kb’ prevent_duplicates:

ajax上传图片

梦想的初衷 提交于 2019-12-05 00:51:16
修改头像 ajax上传图片,必须创建FormDate(),然后把图片加进去. ajax上传图片 $('#id_set_avatar_submit').click(function () { avatar_img = $('#id_avatar')[0].files[0]; var formData = new FormData(); formData.append('avatar_img', avatar_img); $.ajax({ url:"/set_avatar/", type:'post', data:formData, processData:false, contentType:false, success:function (data) { $('#avatar_errors').text(data.msg); } }) }); 来源: https://www.cnblogs.com/hellozizi/p/11892714.html

django中使用KindEditor上传图片

青春壹個敷衍的年華 提交于 2019-12-04 22:05:13
1、创建app01, 并在settings.py里面设置 2、创建一个视图app01/views/test,用于响应KindEditor界面显示的Get请求 from django.shortcuts import render, HttpResponse from django.http import JsonResponse import os from kindeditor_pro import settings # Create your views here. def test(request): if request.method == "POST": content = request.POST.get("content") return render(request, "test2.html", locals()) return render(request, "test.html") 配置对应的路由 urlpatterns = [ url('admin/', admin.site.urls), url('test/', views.test), ] 访问 http://127.0.0.1:8080/test/ 效果如下: 3、项目中创建media文件夹, 设置media媒体路径,首先,要设置后端代码对media访问的路径 在settings.py里面添加一行:

php form表单ajax上传图片方法

若如初见. 提交于 2019-12-04 15:57:49
form表单ajax上传图片方法 先引用jquery.form.js 前台代码 <pre> <form id="form1"> <input id="file_temporaryImage" type="file" name="file_temporaryImage" onchange="TemporaryMedia();"/> <input type="hidden" id="userpicpath"> <img id="userpic" src=""/> </form> <script> function TemporaryMedia() { //var image0 = $("input[name='file_temporaryImage']").val(); //判断上传控件中是否选择了图片 var image = $("#file_temporaryImage").val(); if ($.trim(image) == "") { alert("请选择图片!"); return; } //提交请求处理的url var actionUrl = "/home/kelatoupiao/sctpic/"; //开始ajax操作 $("#form1").ajaxSubmit({ type: "POST", dataType: "json", url: actionUrl, data

简单的PHP上传图片实例

与世无争的帅哥 提交于 2019-12-04 13:21:26
分享一个简单的PHP上传图片实例,本实例主要介绍了上传图片的一些限制判断和上传图片的方法。 首先我们在form表单加上上传附件#file,上传按钮#imgbut,记得给form 表单加上multipart/form-data,否则上传不了图片。 <form enctype="multipart/form-data" action="upload.php?action=img" method="post" name="imge"> <input value="导入文件" type="file" name="img" id="file" /> <input type="submit" id="imgbut" class="btn" value="上传图片" /> </form> 上传之前各种限制判断: if ($_FILES["img"]["error"] > 0) { switch ($_FILES["img"]["error"]) { case 1 : echo "<script type='text/javascript'>alert('上传的文件超过了 php.ini 中 upload_max_filesize 选项限制的值<br>');history.back();</script>"; break; case 2 : echo "<script type='text