我可以使用像这样的html表单将图像成功上传到服务器:
<form id="upload_form" action="/upload" enctype="multipart/form-data" method="post">
<p><input name="image_name" placeholder="Enter Tile Name"></p>
<p>
<input name="image_url" type="file">
<input id='submit' type="submit" value="Upload">
</p>
</form>
如何使用jQuery以编程方式执行完全相同的操作?
更新
好的,所以我已经了解了新的XMLHttpRequest 2和formData函数,并写了这个:
image_name = $('#image_name').val()
formData = new FormData()
formData.append('image_name', image_name)
formData.append('bts_spriteSheet', @bts_spritesheet)
xhr = new XMLHttpRequest()
xhr.open('POST', '/upload', true)
xhr.onload = (e) =>
console.log 'yay its done'
xhr.send(formData)
@bts_spritesheet是使用如下文件选择器获得的:
handleSpritesheetSelection = (evt) =>
files = evt.target.files
f = files[0]
reader = new FileReader()
# Closure to capture the file information.
reader.onload = ((theFile) =>
return (e) =>
@bts_spritesheet = e.target.result
)(f)
reader.readAsDataURL(f)
document.getElementById('upload_spritesheet').addEventListener('change', handleSpritesheetSelection, false)
问题
我的CoffeeScript代码返回Servor 500错误。但是如果工作正常,可以在这个问题的开头使用html表单。