① WEB頁面如何實現拖拽文件夾上傳
目前用戶要通過Web上傳一個文件是通過 <input type="file /"> 這個標記。具體過程需要在一個很傻的對話框里定位文件夾 -> 在大量的文件里找到目標文件 -> 確定 -> 點「上傳」按鈕。我們能不能把這個步驟簡化,實現拖拽上傳呢?
比如說,
1. 在 資源管理器 里選擇一個圖片
2. 拖拽到一個網頁,比如說一個正在編輯的博客
3. 後台AJXJ自動上傳這個圖片
4. 在正在編輯的博客的當前位置直接插入並顯示圖片。
我想用javascript實現。(跟AJAX一樣,有一點hack的味道。)
原理很簡單。首先用戶拖拽一個圖片到瀏覽器,瀏覽器會自動跳轉到這個圖片。比如說我拖拽 D:\test\1.jpg 到瀏覽器,瀏覽器會跳轉當前頁面到 file:///D:/test/1.jpg。那麼我們要做的就是在瀏覽器跳轉之前:
1. 截獲body.onunload事件,並取消瀏覽器的跳轉
2. 獲知瀏覽器將要跳轉到的頁面
3. 自動填寫 <input type="file" />的地址
4. AJAX後台上傳圖片
5. 把圖片插入當前的正在編輯位置。
發這個帖子的目的,想跟大家探討這個設想的可能性。最後希望得出一個結論:可行,還是不可行。如果可行的話我希望深入探討出一個固定的模式。(像AJAX那樣)
② 如何用拖拽和復制方式上傳附件
您好,很高興為您解答。
網易郵箱對添加郵箱附件的操作性進行了全面升級,升級之後網易郵箱新添「附件拖放、復制/粘貼」的附件上傳新方式。
新功能同時支持兼容:IE、火狐、谷歌瀏覽器、360、遨遊、世界之窗等主流瀏覽器,覆蓋率已達到95%。
【附件拖放】
將附件直接拖放到下圖所示區域,就可以輕松地直接添加附件。
【復制/粘貼】
使用滑鼠右鍵 或 Ctrl+C 復制您需要上傳的文件,在下圖所示區域,使用Ctrl+V進行粘貼,即可將附件添加到郵件中,操作簡單方便。
③ 釘盤能不能拖拽文件上傳
您好,電腦端釘盤支持拖拽上傳,直接從本地拖文件或文件夾到釘盤的界面即可。
④ 怎樣用html5實現拖拽上傳文件
,首先要判斷拖入的文件是否符合要求,包括圖片類型、大小等,然後獲取本地圖片信息,實現預覽,最後上傳。
$(function(){
...接上部分
var box = document.getElementById('drop_area'); //拖拽區域
box.addEventListener("drop",function(e){
e.preventDefault(); //取消默認瀏覽器拖拽效果
var fileList = e.dataTransfer.files; //獲取文件對象
//檢測是否是拖拽文件到頁面的操作
if(fileList.length == 0){
return false;
}
//檢測文件是不是圖片
if(fileList[0].type.indexOf('image') === -1){
alert("您拖的不是圖片!");
return false;
}
//拖拉圖片到瀏覽器,可以實現預覽功能
var img = window.webkitURL.createObjectURL(fileList[0]);
var filename = fileList[0].name; //圖片名稱
var filesize = Math.floor((fileList[0].size)/1024);
if(filesize>500){
alert("上傳大小不能超過500K.");
return false;
}
var str = "<img src='"+img+"'><p>圖片名稱:"+filename+"</p><p>大小:"+filesize+"KB</p>";
$("#preview").html(str);
//上傳
xhr = new XMLHttpRequest();
xhr.open("post", "upload.php", true);
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
var fd = new FormData();
fd.append('mypic', fileList[0]);
xhr.send(fd);
},false);
});
⑤ 用js怎麼實現簡單拖拽文件上傳
拖拽還是挺不錯的一個頁面效果,我個人認為,其生命力在於可以讓用戶自己做一些操作,所謂自定義。例如:
①瀏覽器標簽順序的拖拽切換
現在基本上所有的選項卡式的瀏覽器都有順序拖拽切換的功能,如下圖:
類似的效果我們可以在QQ精要新聞彈出框中看到,見下圖:
②把內容放在自己喜歡的位置上
這個在桌面軟體上見到的最多,比如視頻播放器,Adobe系列軟體(CS3+)等。
⑥ 求助:文件拖拽上傳,全瀏覽器都兼容方法
這種文件拖拽方法都是用HTML5寫的,不可能所有瀏覽器都兼容,我們當時處理的辦法是做成既可以拖拽又可以點擊上傳的模式.可以看一下115網盤怎麼做的,他們就是只有IE8不支持,其他都支持
⑦ 我想在ivx里做個文件分享系統,怎麼實現拖拽上傳文件功能
實現拖拽上傳文件功能不用寫代碼的,有現成的組件可以用,用法不難。下面說一下步驟:
添加拖拽放置容器
總結
需要注意的是拖拽放置容器只是將文件拖拽到了容器內部,具體上傳到伺服器還是要通過文件介面組件的,他只是提供了一種操作模式。另外在細節上,可以在拖拽進入事件下改變容器的背景顏色,然後拖拽離開時再將背景顏色重置為初始狀態。這樣用戶將文件拖進容器區域內會有一個明顯的展示效果的變化,用戶體驗也會更好一些。⑧ 文件拖拽上傳怎麼用
一般需要按照提示安裝相應的插件,安裝成功後按照提示將你需要上傳的文件拖動到相應的窗口區域,松開滑鼠即可上傳。
⑨ Java swing怎麼實現上傳文件並支持拖拽上傳
你這個復雜了,我稍微說說吧。
進度條稍微簡單點,你就去看看Oracle的tutorial就行了,記得運用科學(或者不用?)
拖拽不是一下能寫出來的,我隨便拉了一個例子,你研究下:
{
@Override
publicbooleancanImport(TransferHandler.TransferSupportsupport){
for(DataFlavorflavor:support.getDataFlavors()){
if(flavor.isFlavorJavaFileListType()){
returntrue;
}
}
returnfalse;
}
@Override
@SuppressWarnings("unchecked")
publicbooleanimportData(TransferHandler.TransferSupportsupport){
if(!this.canImport(support))
returnfalse;
List<File>files;
try{
files=(List<File>)support.getTransferable()
.getTransferData(DataFlavor.javaFileListFlavor);
}catch(UnsupportedFlavorException|IOExceptionex){
//shouldneverhappen(orJDKisbuggy)
returnfalse;
}
for(Filefile:files){
//dosomething...
}
returntrue;
}
}用的時候:
myComponent.setTransferHandler(newFileDropHandler());
⑩ selenium怎麼實現文件拖拽上傳功能
selenium只能操作瀏覽器的對象,不能操作windows對象
selenium裡面有頁面元素的拖拽操作
調用第三方的東東,貌似可以實現文件上傳,這個我也正在研究中
但是直接將文件托在瀏覽器實現上傳,這個selenium好像還真不行……
文件本身是屬於windows的