【 js 上传文件】
上传文件
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title> <!--引用相关的js文件 注意先引用jquery-->
<script src="js/jquery-1.11.3.js"></script>
<script src="js/ajaxfileupload.js"></script> <style>
.file {
position: relative;
background-color: #b32b1b;
border: 1px solid #ddd;
width: 68px;
height: 25px;
display: inline-block;
text-decoration: none;
text-indent: ;
line-height: 25px;
font-size: 14px;
color: #fff;
margin: auto;
cursor: pointer;
text-align: center;
border: none;
border-radius: 3px;
} .file input {
position: absolute;
top: ;
left: -2px;
opacity: ;
width: 10px;
}
</style>
<script>
$(function () {
//选择文件
$(".file").on("change", "input[type='file']", function () {
var filePath = $(this).val();
//设置上传文件类型
////if (filePath.indexOf("xls") != -1 || filePath.indexOf("xlsx") != -1) { //上传文件
$.ajaxFileUpload({
url: 'FileHandler.ashx',//处理程序路径
secureuri: false,
fileElementId: 'btnfile',
dataType: 'json',
success: function (data, status) {
//获取上传文件路径
//$("#txt_filePath").val(data.filenewname);
alert("文件上传成功!");
},
error: function (data, status, e) {
//alert(e);
alert("not");
}
}); ////} else {
//// alert("请选择正确的文件格式!");
//// //清空上传路径
//// $("#txt_filePath").val("");
//// return false;
////}
});
})
</script>
</head>
<body style="font-size:25px;"> <!--ajax配合ashx实现文件上传--> <div>
<span>选择文件:</span><input id="txt_filePath" type="text" readonly="readonly" />
<a class="file"><input id="btnfile" name="btnfile" type="file" />浏览</a>
</div>
</body>
</html>
【 js 上传文件】的更多相关文章
- 使用ajaxfileupload.js上传文件
一直以来上传文件都是使用form表单上传文件,也看到过有人使用js上传文件,不过看起来蛮简单的也就没有怎么去理会.今天突然要使用这种方式上传文件,期间还遇到点问题.因此就记录下来,方便以后遇到这样的问 ...
- js 上传文件后缀名的判断 var flag=false;应用
js 上传文件后缀名的判断 var flag=false;应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
- js上传文件带参数,并且,返回给前台文件路径,解析上传的xml文件,存储到数据库中
ajaxfileupload.js jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId ...
- atitit.javascript js 上传文件的本地预览
atitit.javascript js 上传文件的本地预览 1. .URL.createObjectURL 1 1.1. 吊销所有使用 URL.createObjectURL 而创建的 URL,以 ...
- 前端js上传文件 到后端接收文件
下面是前端js代码: <html> <head> <meta http-equiv="Content-Type" content="text ...
- 纯js上传文件 很好用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- 原生js上传文件,使用new FormData()
当创建一个内容较多的表单,表单里面又有了文件上传,文件上传也需要表单提交,单一的上传文件很好操作: <form action="接口" enctype="multi ...
- django + dropzone.js 上传文件
1.dropzone.js http://www.dropzonejs.com/ dropzone.js是一个可预览\可定制化的文件拖拽上传,实现AJAX异步上传文件的工具 2.dropzone.js ...
- js上传文件
一.原始的XMLHttpRequestjs上传文件过程(參考地址:http://blog.sina.com.cn/s/blog_5d64f7e3010127ns.html) 用到两个对象 第一个对象: ...
- js上传文件获取文件流
上传文件获取文件流 <div> 上传文件 : <input type="file" name = "file" id = "file ...
随机推荐
- [NOI2003]文本编辑器 [Fhq Treap]
[NOI2003]文本编辑器 没啥好说的 就是个板子 #include <bits/stdc++.h> // #define int long long #define rep(a , b ...
- 第31届IMO 第2题
题目 设n>=3,考虑一个圆上由2n-1个不同点构成的集合E.现给E中恰好k个点染上黑色,如果至少有一对黑点使得这两个黑点之间的弧上(两段弧中的某一个)包含恰好E中的n个点,就成这样的染色方法是 ...
- Java课后总结-原码、补码、反码
1.原码.补码.反码的定义和表示方法. 数在计算机中是以二进制形式表示的. 数分为有符号数和无符号数. 原码.反码.补码都是有符号定点数的表示方法. 一个有符号定点数的最高位为符号位,0是正,1是副. ...
- Wannafly Camp 2020 Day 2B 萨博的方程式 - 数位dp
给定 \(n\) 个数 \(m_i\),求 \((x_1,x_2,...,x_n)\) 的个数,使得 \(x_1 \ xor\ x_2\ xor\ ...\ xor\ x_n = k\),且 \(0 ...
- pandas玩转excel-> (1)如何利用pandas创建【行,列,单元格】
import pandas as pd #------新建单元格的方法一:通过先创建字典的形式 #可以先新建一个字典d={'x':100,'y':200,'z':300} #打印字典的索引print( ...
- 统一身份认证服务IdentityServer4实践
导读 当企业的应用系统逐渐增多后,每个系统单独管理各自的用户数据容易形成信息孤岛,分散的用户管理模式阻碍了企业应用向平台化演进.当企业的业务发展到一定规模,构建统一的标准化账户管理体系将是必不可少的, ...
- Qt 程序打包发布总结 转
1. 概述 当我们用QT写好了一个软件,要把你的程序分享出去的时候,不可能把编译的目录拷贝给别人去运行.编译好的程序应该是一个主程序,加一些资源文件,再加一些动态链接库,高大上一些的还可以做一个安装 ...
- Educational Codeforces Round 65 (Rated for Div. 2)B. Lost Numbers(交互)
This is an interactive problem. Remember to flush your output while communicating with the testing p ...
- 2018ICPC南京站Problem J. Prime Game
题意: 对于所有数字分解质因子,如果某个质因子在这个区间出现,则贡献为1,求所有质因子对所有区间做的贡献. 解析: 考虑如果所有全部区间都有这个质因子则这个质因子的贡献是n*(n+1)/2,对于任意因 ...
- linux - redis-trib.rb 命令详解
参考网站 http://www.cnblogs.com/ivictor/p/9768010.html 简介 redis-trib.rb是官方提供的Redis Cluster的管理工具,无需额外下载,默 ...