当前位置:首页 » 文件管理 » html上传插件

html上传插件

发布时间: 2022-08-06 23:17:27

1. html的上传控件在谷歌火狐等浏览器中怎么获取绝对路径啊

因为安全原因,本地都获取不了绝对路径,只有上传到服务器,保存后,可以获取文件在服务器的绝对路径,考虑兼容性一般都是使用Jquary插件,推荐Uploadify

2. 请问ASP要如何使用jquery的插件uploadify,官网上的只有php

Uploadify简单说来,是基于Jquery的一款文件上传插件。它的功能特色总结如下:

支持单文件或多文件上传,可控制并发上传的文件数

在服务器端支持各种语言与之配合使用,诸如PHP,.NET,java……

通过参数可配置上传文件类型及大小限制

通过参数可配置是否选择文件后自动上传

易于扩展,可控制每一步骤的回调函数(onSelect, onCancel……)

通过接口参数和CSS控制外观

更多……

相关链接

Uploadify主页地址:http://www.uploadify.com/ 在该页面你可以了解到关于他的更多内容。

Uploadify在线演示:在线Demo

Uploadify配置参数及接口文档:http://www.uploadify.com/documentation

Uploadify插件下载地址:http://www.uploadify.com/download

使用方法

下载插件安装包后,可以看到里面的几个主要文件:jquery.uploadify.js(完成上传功能的脚本文件,在调用页面引用)、uploadify.css(外观样式表)、uploader.swf(上传控件的主体文件,flash控件)、upload.php(服务器端处理文件,官方仅提供了php版的)

引用了插件文件后,在页面中做如下调用:

//声明一个普通的html文件上传控件,并指定id

<input type="file" name="fileInput" id="fileInput" />

//将声明的普通上传控件与Uploadify插件绑定

<script type="text/javascript">

$(document).ready(function() {

$('#fileInput').fileUpload ({

//以下参数均是可选

'uploader' : 'uploader.swf', //指定上传控件的主体文件,默认‘uploader.swf’

'script' : 'upload.php', //指定服务器端上传处理文件,默认‘upload.php’

'cancelImg' : 'cancel.png', //指定取消上传的图片,默认‘cancel.png’

'auto' : true, //选定文件后是否自动上传,默认false

'folder' : '/uploads' //要上传到的服务器路径,默认‘/’

'muti' : true, //是否允许同时上传多文件,默认false

'fileDesc' : 'rar文件或zip文件' //出现在上传对话框中的文件类型描述

'fileExt' : '*.rar;*.zip', //控制可上传文件的扩展名,启用本项时需同时声明fileDesc

'sizeLimit': 86400 //控制上传文件的大小,单位byte

'simUploadLimit' :5 //多文件上传时,同时上传文件数目限制

});

});

</script>

上面列出了我认为常用的配置选项,此外还有很多参数可配置,参考官方文档

通过调用相关功能函数,声明功能按钮。

例如声明上传功能按钮(自动上传时不需要):

<a href="javascript:$('#fileInput').fileUploadStart();">上传文件</a>

声明取消多文件上传时上传队列:

<a href="javascript:$('#fileInput').fileUploadClearQueue();">取消上传队列</a>

文章来自中国建站:http://www.jz123.cn/text/2419333.html

3. html5 大文件断点续传 插件有哪些比较好

上传:
上传时附带一个描述数据起始位置的参数。
接受的一端接收到数据后,按照起始位置续写文件。
下载:
按照本地已保存的大小,提交下载请求。
服务器按照请求的位置,传数据。

大概就是这么个意思。还要处理很多异常情况。

4. html5+上传图片时有没有截图的插件(手机端的)

按住电源键(关机键)的同时按主屏幕(HOME)键,听见"咔嚓"一声,就代表截图成功了。
另外还有用截图软件截图的,你可以下载一款在你手机上最好用的截图软件,安装后就可以使用截图功能了。答题不易,互相帮助,手机提问的朋友在客户端右上角评价点满意即可.
如果你认可我的回答,请点击采纳为满意回答按钮!

5. html上传图片怎么弄

可以将图片转base64,也可以直接当成文件上传。代码有点多,就不写了,如果实在不会就找插件吧

6. html 添加插件/文件上传加密

这个需要通过控件来实现。

7. 如何使用第三方上传插件web uploader的demo

要解决302问题也很简单,就是html5的文件上传,正好最近在ueditor里看到网络的webuploader,会自动选择flash html5,就是一个成熟的解决方案了。

先看前端,我们将最常用的操作封装为插件,asp.net中和MVC中最好使用相对于应用程序的绝对路径,自行定义全局 applicationPath :var applicationPath = "@(Href("~")=="/"?"":Href("~"))";
前端插件代码:

8. extjs 3.4中 怎么给htmlEdit添加图片插件 实现图片上传功能

首先要使用extjs自带的HTMLEditor,然后在原有的工具条上添加一个图片按钮,点击这个图片按钮要弹出窗口,这个窗口负责实现上传功能,实现上传后,要将上传的图片路径添加到HTMLEditor的光标处,并且要以<IMG></IMG>的方式,这样HTMLEditor才能解析出来。实现代码如下:

前台JSP页面



fieldLabel : '商品特性',
id : 'shopSp.spTxms',

name : 'shopSp.spTxms',
xtype : 'StarHtmleditor',
anchor : '93%'


这其中引用了StarHtmleditor,StarHtmleditor.js的代码如下,直接将代码复制下来,然后新建个JS,全复制进去就行了。


var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, {
addImage : function() {
var editor = this;
var imgform = new Ext.FormPanel({
region : 'center',
labelWidth : 55,
frame : true,
bodyStyle : 'padding:5px 5px 0',
autoScroll : true,
border : false,
fileUpload : true,
items : [{
xtype : 'textfield',
fieldLabel : '选择文件',
id : 'UserFile',
name : 'UserFile',
inputType : 'file',
allowBlank : false,
blankText : '文件不能为空',
anchor : '90%'
}],
buttons : [{
text : '上传',
handler : function() {
if (!imgform.form.isValid()) {return;}
imgform.form.submit({
waitMsg : '正在上传......',
url : 'HTMLEditorAddImgCommonAction.action',
success : function(form, action) {
var element = document.createElement("img");
element.src = action.result.fileURL;
if (Ext.isIE) {
editor.insertAtCursor(element.outerHTML);
} else {
var selection = editor.win.getSelection();
if (!selection.isCollapsed) {
selection.deleteFromDocument();
}
selection.getRangeAt(0).insertNode(element);
}
//win.hide();//原始方法,但只能传一个图片
//更新后的方法
form.reset();
win.close();
},
failure : function(form, action) {
form.reset();
if (action.failureType == Ext.form.Action.SERVER_INVALID)
Ext.MessageBox.alert('警告','上传失败',action.result.errors.msg);
}
});
}
}, {
text : '关闭',
handler : function() {
win.close(this);
}
}]
})

var win = new Ext.Window({
title : "上传图片",
width : 300,
height : 200,
modal : true,
border : false,
iconCls : "picture.png",
layout : "fit",
items : imgform

});
win.show();
},
createToolbar : function(editor) {
HTMLEditor.superclass.createToolbar.call(this, editor);
this.tb.insertButton(16, {
cls : "x-btn-icon",
icon : "picture.png",
handler : this.addImage,
scope : this
});
}
});
Ext.reg('StarHtmleditor', HTMLEditor);

JS的第一句var HTMLEditor = Ext.extend(Ext.form.HtmlEditor, 网上是没有var的,不用var不知道为什么总是报错,另外JS一定要与JSP的编码方式一致,要不然报莫名其妙的错误,而且错误都没有显示。

后台java代码



/****
* HTMLEditor增加上传图片功能:
* 1、上传图片后,需要将图片的位置及图片的名称返回给前台HTMLEditor
* 2、前台HTMLEditor根据返回的值将图片显示出来
* 3、进行统一保存
* @param 上传图片功能
* @return JSON结果
* @throws IOException
*/
public void HTMLEditorAddImg() throws IOException {
if(!"".equals(UserFile) && UserFile != null && UserFile.length() > 0){
File path = ImportImg(UserFile, "jpg");
UserFilePath = "../" + path.toString().replaceAll("\\", "/").substring(path.toString().replaceAll("\\", "/").indexOf("FileImg"));
}
this.getResponse().setContentType("text/html");
this.getResponse().getWriter().write("{success:'true',fileURL:'" + UserFilePath + "'}");
}


特别要注意的是路径问题,路径问题主要有2点需要注意:

1、前台页面引用StarHtmleditor.js的路径一定要正确;

2、Htmleditor上传的图片路径一定要改,因为上传之后图片路径变为http://localhost:8080/,在正常使用中图片不显示,要将该地址替换为服务器的IP地址;替换方法如下:


//获取本地IP地址,因为extjs的htmleditor上传的照片路径有问题,需要将路径替换为本机IP地址
InetAddress inet = InetAddress.getLocalHost();
shopSp.setSpTxms(shopSp.getSpTxms().replace("localhost", inet.getHostAddress().toString()));

这样基本就完成了这个HTMLEditor上传图片功能。

如图:

9. HTML中上传文件的表单(file有一个编辑框和一个浏览的按钮),客户只想要一个按钮,要求把编辑框去掉

如果那样的话,只能将 浏览器自带的file控件进行隐藏,使用其他开源的上传组件替代。

jquery上传插件 自己网上网络下,剩下的靠你自己了。

推荐=》 uploadify.

热点内容
玉石密度算法 发布:2024-05-04 01:24:49 浏览:333
我的世界云服务器怎么样 发布:2024-05-04 01:20:01 浏览:21
androidsdk包含 发布:2024-05-04 00:45:54 浏览:208
android拷贝文件 发布:2024-05-04 00:38:28 浏览:776
存储冗余比 发布:2024-05-04 00:12:58 浏览:404
oracle数据库存储原理 发布:2024-05-04 00:10:40 浏览:523
未拆封玩客云3怎么搭建服务器 发布:2024-05-04 00:06:11 浏览:797
彻底删除编译安装的文件 发布:2024-05-04 00:05:33 浏览:55
编程机构数量 发布:2024-05-03 23:49:25 浏览:955
python源码编译安装 发布:2024-05-03 23:48:16 浏览:108