javascript切片,js 切片

JavaScript 大文件分片上传处理如何实现？

!DOCTYPE html html head meta charset="UTF-8" titleupload/title script src=""/script /head body input type="file" name="file" id="file" button id="upload" onClick="upload()"upload/button script type="text/javascript" var bytesPerPiece = 1024 * 1024; // 每个文件切片大小定为1MB . var totalPieces; //发送请求 function upload() { var blob = document.getElementById("file").files[0]; var start = 0; var end; var index = 0; var filesize = blob.size; var filename = blob.name; //计算文件切片总数 totalPieces = Math.ceil(filesize / bytesPerPiece); while(start filesize) { end = start + bytesPerPiece; if(end filesize) { end = filesize; } var chunk = blob.slice(start,end);//切割文件 var sliceIndex= blob.name + index; var formData = new FormData(); formData.append("file", chunk, filename); $.ajax({ url: '', type: 'POST', cache: false, data: formData, processData: false, contentType: false, }).done(function(res){ }).fail(function(res) { }); start = end; index++; } } /script /body /html

相关问答

Q1: 前端工程师，请问切图是什么意思？我会写div﹢css已经比较熟练了，js也、jquery这些也学完

是的，做前端必须必须会切图，但是 切图 就是PS里面的一步操作，十分简单。QQ截图和PS切图是动作不一样，但是基本上是一样的，QQ是截取，而PS里面有个工具张的像 刀 ，拿着这个刀在图上面画，所以叫切图。

你选择这个工具，选择切片工具，然后：

在图片上这么画上一块儿或者说切上一刀，就叫切图。

然后在选择 文件→储存为web所用格式→在用切图选择工具

把你需要保存的切图那块儿选中，点击存储，

选择选中的切片，在点击保存，就这么先切，在选择，在保存，就完成了切图，但是PS切图比qq截图用着爽多了，因为在PS里面可以将图片放大N倍，在切，在小的图也能切，而且可以一次切很多，也能一次保存很多，所以比QQ截图用着爽。总体来讲比QQ截图专业吧。

Q2: javascript：关于Function.prototype.bind()这个方法

这里确实是两个arguments，而且这两个arguments是不同的。

首先你要理解prototype里bind()函数的含义，bind()函数和apply()、call()函数一样，都是用来改变函数的上下文环境（即函数中this所指代的对象），与之不同的是，apply()和call()都是立即执行获取结果，而bind()可以返回一个已经改变了上下文环境的函数，供日后调用。而这个函数本身是有参数的，这里bind()函数就是可以在函数获取上下文环境时给其传参，同时也可以在函数调用时给其传参，所以这里会有两个arguments。

举个例子吧，比方你有一个可变基数的累加函数：

var add = function() {

    var sum = this.base

    for (var i = 0, c; c = arguments[i++];)

        sum += c

    return sum

}

在这个函数中，基数值base是通过上下文环境决定的，如果基数是1，那么add(1)的结果就是2，如果基数是10，那么add(1)的结果就是11。当然本函数的参数是可变的，当基数为10时，你也可以这么写：add(1,2,3,4)，其结果为10+1+2+3+4=20。

那函数的上下文环境怎么决定呢？就是题主所提到的bind()函数。下面我们规定两个上下文：

var context1 = {

    base: 1

}

var context2 = {

    base: 10

}

这样当你就可以通过bind创造一个基数为1和基数为10的累加函数：

var addbase1 = add.bind(context1, 9)

var addbase10 = add.bind(context2)

什么？你问我为什么addbase1在bind的时候会有两个参数（context1、9）？因为这里其实等于我在bind的同时就给addbase1这个函数开始传参啦，这个就是题主题目中的第一个arguments。还记得那个切片arguments.slice(1)么？就是把提供上下文的参数context1切掉了，保留了传给addbase1的参数9。

当然，在定义了函数之后我也可以正常传参，如：

addbase1(1, 2, 3, 4)  //结果为20

addbase10(1, 2, 3, 4) //结果也是20

这里的1,2,3,4就是题主所谓的第二个arguments，而我们看到函数addbase1的结果和addbase10的结果一样，就是因为在bind函数里有一行concat，将我们两次传入的arguments结合了起来，使得addbase1的过程变成：1(基底)+9(第一次传参)+1+2+3+4 = 20

但是要注意的时，第一次传参的arguments和第二次传参的arguments是不同的，因为第一次传入的参数会被保存在函数的闭包中，成为一种currying的属性，不会随着以后的传参而改变（即保存在了代码第五行的args中）。也就是说，当你再次执行如下代码时：

addbase1(1, 2, 3, 4)  //结果依然是20，实际上addbase1和addbase10一样了

实际上也就是说，在bind时传入的参数，也就是第一个arguments，会影响函数的属性；在调用时传入的参数，也就是第二个arguments，不会影响函数的性质。

希望能帮到你。

Q3: 【有关网页设计的问题！！求答！！回答满意再赏！】

先回答你的问题：

第一：软件：dreamweaver（目前比较流行，你说的frontpage也可以，但现在用的人也来越少了）需要学习静态网页知识html、css。

第二：这个问题在这里是说不清楚的，这一步涉及到程序设计。属于动态网站的范畴了。

第三，根据你的需求的话，你可以租一个虚拟空间就可以了，服务器还用不着，有点浪费；租用虚拟空间的时候还得看你用的是什么语言和数据库

接下来我补充一些：

首先，原谅我毫不避讳的讲，如果你对网页设计一窍不通，要做出你说的那样相当难！

但是对于一个所谓与偶程序语言基础的人和网页设计出的人来说又是很简单的。

其次，要做到你讲的第一步的话，通过学习一段时间静态网站的制作你是可以完全达到的，但是你的后面的要求就是属于动态网站的范畴了，需要进一步学习程序语言。

简单的说一下网站的制作流程：

第一：策划构思

第二：设计出图；这一步需要良好的设计功底，会photoshop等软件

第三：切片并制作静态页面；这一步需要用到html知识，比如div+css,javascript等。

在制作静态页面的过程中需要接触到dreamweaver（目前比较流行，你说的frontpage也可以，但现在用的人也来越少了）

如果要继续深入，还可以了解学习flash以及actionscript。可以制作出更多好看的动画效果。

（到这一步你就可以完成你的第一个要求，到这一步就可以制作出一个静态网页了要达到你的第二个要求还得看下面的。）

第四：套用程序，程序可以使自己更具需求写的，也可以是使用现成的CMS系统自己改变一下；这一步是一个很复杂的过程，很多种程序都可以制作网站，比如：php,asp,.net,java等等，还需要学习数据库如：mysql，mssql等，以及本地服务器环境搭建。使用现成的CMS的话我推荐织梦、动易，帝国、康盛等知名cms,这些开源的CSM可以满足一般网站的需求，大大减少我们的研发时间。

第五：上传到服务器，需要用到学习上一步学习服务器环境搭建，比如IIS的配置等···