มีปลั๊กอินอัปโหลดไฟล์ jQuery ลากและวางที่ดีหรือไม่? [ปิด]


174

มีปลั๊กอิน jQuery ที่เรียบร้อยซึ่งอนุญาตให้รวมสคริปต์ JS เดียวจากนั้นใช้ข้อมูลโค้ดอย่างง่ายเพื่อเปิดใช้งานฟอร์มหรือไม่ บางสิ่งเช่นนี้

$j('#MyForm').enableDragDropUploads('.upload-area')

ด้วยเป้าหมายการอัปโหลดเป็นการกระทำของแบบฟอร์ม

วิธีการแก้ปัญหาใด ๆ จะต้องไม่ป้องกันฟิลด์ไฟล์ปกติจากการใช้งาน (โดยใช้วิธีการสืบค้นแบบดั้งเดิม)

ฉันต้องการเพียงหนึ่งไฟล์ในแต่ละครั้ง แต่แน่นอนว่าการมีตัวเลือกสำหรับหลายไฟล์นั้นไม่ใช่เรื่องเลวร้าย

ฉันพบตัวอย่างการอัปโหลดแบบลากสองสามรายการ:
http://www.appelsiini.net/2009/10/drag-and-drop-file-upload-with-google-gears http: //www.appelsiini สุทธิ / 2009/10 / HTML5 ลากและวาง-หลายไฟล์ที่อัปโหลด

แต่รหัสนั้นไม่มีการตั้งค่าเป็นปลั๊กอิน อาจไม่ใช่เรื่องยากที่จะเปลี่ยนแปลง แต่ก็ไม่มีประโยชน์ถ้าคนอื่นทำงานแล้วและหลีกเลี่ยงการค้นหาโดย Google ของฉัน

ฉันกำลังมองหาโซลูชัน HTML5 / jQuery อย่างแท้จริง
Google Gears สามารถใช้ได้ แต่โซลูชัน Flash ไม่ได้


3
วิธีการแก้ไขนั้นใช้ได้เฉพาะในรุ่น Bleeding edge ของ firefox เท่านั้น ปัจจุบันยังไม่มีการสนับสนุนนอกเหนือจาก firefox 3.6 ในกรณีนี้คุณไม่น่าจะพบปลั๊กอิน jQuery และคุณอาจต้องทำเอง
Jojo

1
Bah รุ่นอัลฟ่าออกมาสองสามเดือนซึ่งควรจะนานพอ : / ฉันเดาว่าฉันจะไปสร้างปลั๊กอินด้วยตัวเองแล้ว จะตอบคำถามเมื่อฉันทำมันเสร็จ
Peter Boughton

@PeterBoughton หากคุณยังไม่ได้ทำการติดตั้งปลั๊กอินคุณอาจต้องการคำตอบ
Basic

ขอบคุณสำหรับพรอมต์เบสิค ยังไม่ได้ดูที่นี้ในทุกวัย แต่ดูเหมือนว่ามีรายการโปรดที่ชัดเจน (และจากการดูอย่างรวดเร็วดูเหมือนว่าดี) ดังนั้นฉันจะยอมรับว่า
Peter Boughton

สำหรับเครื่องมืออัปโหลด JavaScript ที่มีการเคลื่อนไหวรวดเร็วสนับสนุนและมีคุณสมบัติครบครันโดยไม่มีการขึ้นต่อกันให้ดูที่Fine Uploaderเดิมชื่อ valums / file-uploader
เรย์นิโคลัส

คำตอบ:


134

ดูที่นี่: http://aquantum-demo.appspot.com/file-upload

มันยังรองรับการอัปโหลดไฟล์หลายไฟล์!


7
เพิ่งทดสอบ มันดีมากสำหรับ Chrome และ Firefox ลดระดับลงเป็นปุ่มอัพโหลดปกติภายใต้ IE (แต่ดังนั้นจึงปลอดแฟลช ... )
Frank Nocke

2
ฉันกำลังมองหาปลั๊กอินอัปโหลดไฟล์เช่นกันอันนี้ไม่สามารถใช้งานได้ในปี 2015 (อาจจะใช้งานได้ในปี 2011) .. มีคนรู้จักปลั๊กอิน "fileupload" ที่ใช้งานได้หรือไม่
Eran Meir

30

ลองดูตัวจัดการการอัปโหลดที่เพิ่งเปิดตัว1ตัวจากพวกที่สร้างเครื่องมือแก้ไข TinyMCE มันมีวิดเจ็ต jQuery และดูเหมือนว่าจะมีชุดคุณสมบัติที่ดีและทางเลือก

http://www.plupload.com/


ฉันแนะนำให้ใช้ plupload เนื่องจากใช้ประโยชน์จากเทคโนโลยีอื่น ๆ เพื่อประสบการณ์การใช้งานที่ดีที่สุด
rickyduck

all_runtime ใช้งานไม่ได้สำหรับฉันใน Chrome 15 ซึ่งควรเป็นจุดลองด้วยตัวคุณเอง: plupload.com/example_all_runtimes.php
Erik Johansson

1
มันไม่ฟรีสำหรับการใช้งานเชิงพาณิชย์ (ใช้ GPL สำหรับรุ่นฟรี)
Sachin Joseph


15

หากคุณยังคงมองหาอยู่ฉันเพิ่งเปิดตัวเหมือง: http://github.com/weixiyen/jquery-filedrop

ใช้งานได้กับ Firefox 3.6 ในตอนนี้ ฉันตัดสินใจที่จะไม่แฮก Chrome ในตอนนี้และปล่อยให้ Webkit ติดตาม FileReader () ใน Safari และ Chrome เวอร์ชันถัดไป

ปลั๊กอินนี้เข้ากันได้ในอนาคต

FileReader () เป็นมาตรฐานอย่างเป็นทางการมากกว่า XHR.getAsBinary () ซึ่งคัดค้าน mozilla

นอกจากนี้ยังเป็นปลั๊กอินลากและวาง HTML5 บนเดสก์ท็อปเท่านั้นที่ฉันรู้ซึ่งช่วยให้คุณสามารถส่งข้อมูลเพิ่มเติมพร้อมกับไฟล์รวมถึงข้อมูลที่สามารถคำนวณได้ในขณะอัปโหลดด้วยฟังก์ชันการโทรกลับ


1
เอกสารนี้ค่อนข้างบาง (จนถึงตอนนี้ในปี 2013) แต่ก็ใช้งานได้ดีพอสมควร
dansan

1
แต่ไม่มีการสาธิต! คืออะไรกับที่
Sagive SEO

15

หากคุณกำลังมองหาสิ่งที่ไม่ต้องพึ่งพาแฟลชแล้ว dropzonejs เป็นเสียงที่ดี สนับสนุนหลายไฟล์และลากและวาง

http://www.dropzonejs.com/


คำแนะนำดั้งเดิมของคุณย้ายไปที่github.com/Widen/fine-uploaderในเดือนมีนาคม
เรย์นิโคลัส

ขอบคุณสำหรับสิ่งนั้น ดูเหมือนว่าเป็นข้อเสนอแบบชำระเงินแล้ว (สำหรับการใช้งานเชิงพาณิชย์)
Ross Gledhill

ถูกต้อง. เราไม่สามารถให้ระดับการสนับสนุนและความเร็วในการพัฒนาที่เราเสนอให้ฟรี
เรย์นิโคลัส

นี่คือการสอนที่ดีของการอัปโหลดภาพลาก / วางโดยใช้ dropzonejs goo.gl/FVdkS0
Satinder singh

ไม่ใช่เรื่องง่ายที่จะรวมเข้ากับแบบฟอร์มที่มีอยู่ นั่นเป็นเหตุผลที่ฉันตัดสินใจย้ายออกจาก dropzone
Usman Khalid


8

เสียบไร้ยางอาย:

Filepicker.ioจัดการอัปโหลดให้คุณและส่งคืน URL รองรับการลาก / วางข้ามเบราว์เซอร์ นอกจากนี้ผู้คนสามารถอัพโหลดจาก Dropbox / Facebook / Gmail ซึ่งเป็นอุปกรณ์พกพาที่มีประโยชน์มาก


4

วิธีการเกี่ยวกับ jQuery Fileuploader รุ่นล่าสุด: http://pixelcone.com/fileuploader/

มันเป็นปลั๊กอินอัปโหลดไฟล์ที่มีประสิทธิภาพติดตั้งง่ายมากเมื่อเทียบกับปลั๊กอินอื่นและตอนนี้มันรองรับ html5 api


1
jQuery Fileuploader มีใบอนุญาตใดบ้าง คุณควรอธิบายให้ชัดเจนทั้งในเว็บไซต์ของคุณและในซอร์สโค้ดของปลั๊กอินของคุณเช่นกันฉันคิดว่า :)
OpaCitiZen

ลิงก์ที่ใช้งานไม่ได้ลิงก์นี้ถูกต้องไหม
Puce
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.