html5的文件api示例与jquery?

前端之家收集整理的这篇文章主要介绍了html5的文件api示例与jquery?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想使用html5的文件api,结合外部拖放功能(将外部文件拖放到指定的位置并捕获其内容)和jquery。我发现一个工作的非jquery示例:( html5 demo: file api) @H_403_2@var drop = document.getElementById('drop'); drop.ondragover = function () {this.className = 'focus'; return false;}; drop.ondragend = function () { this.className = ''; return false; }; drop.ondrop=function(e) { this.className = ''; e.preventDefault(); var file = e.dataTransfer.files[0]; var reader = new FileReader(); reader.onload = function (evt) { console.log(evt.target.result); } reader.readAsText(file); };

这工作正常现在我想让这更多的是一个jquery-ish,我试过:

@H_403_2@$("#drop").bind('ondragover',function() {this.addClass('focus'); return false;}) .bind("ondragend",function () { this.removeClass('focus'); return false;}) .bind("ondrop",function(e) { this.removeClass("focus"); e.preventDefault(); var file = e.dataTransfer.files[0]; var reader = new FileReader(); reader.onload = function (evt) { console.log(evt.target.result); } reader.readAsText(file); });

但是这不行,没有绑定的事件似乎被触发。我也试图松开事件名称的“开”部分,但也不行。
希望有人能在这里发光吗?

问候,
吉荣。

解决方法

解决方案很简单。

>丢掉前缀(这就是为什么没有抛出任何事件)
>这个。 => $(本)。 (这就是为什么当事件没有发生什么事情发生时,它给了一个错误)。

跟我一起工作

猜你在找的HTML5相关文章