我在这个结构中有一个blob数据:
Blob {type: "audio/wav", size: 655404, slice: function}
size: 655404
type: "audio/wav"
__proto__: Blob
Run Code Online (Sandbox Code Playgroud)
它实际上是使用最近的Chrome getUerMedia()和Recorder.js记录的声音数据
如何使用jquery的post方法将此blob上传到服务器?我没试过就试过这个:
$.post('http://localhost/upload.php', { fname: "test.wav", data: soundBlob },
function(responseText) {
console.log(responseText);
});
Run Code Online (Sandbox Code Playgroud) 有没有办法设置文件input(<input type="file" />)的值,还是所有被阻止的安全性?我正在尝试使用谷歌齿轮的openFiles来制作一个简单的多重上传器.
注意:
下面的答案反映了2009年遗留浏览器的状态.现在,您可以在2017年使用JavaScript动态/编程地设置文件输入元素的值.
有关详细信息和演示,请参阅此问题中的答案:
如何以编程方式设置文件输入值(即:拖放文件时)?
我正在尝试创建一个控件,您可以在其中选择要在表单中提交的文件,并将文件放入其中以执行相同的操作.我有这样的东西,如果它是一个图像,它也会显示该文件的预览:
<div class="preview-image-container">
<input type="file" name="File" id="File" accept="image/*"
class="image-url form-control" style="display:none;" />
<div class="preview-image-dummy"></div><img class="preview-image-url" />
<div class="preview-image-instruction">
<div class="preview-image-btn-browse btn btn-primary">Select file</div>
<p>or drop it here.</p>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
用户删除文件preview-image-container.该文件未随AJAX提交,用户需要提交包含更多数据的表单.
出于安全原因,我们不允许使用JavaScript更改输入文件的值.但是,我知道默认输入文件支持droppable,并且有一些网站让我们通过将它们放在表单中来选择文件,所以我的猜测是有一种方法可以做到这一点.
正如您从MCVE中看到的,我只对使用jQuery或纯JavaScript而不使用其他库感兴趣.
虽然可以使用dropzone.js,但它不符合我的要求,需要花费大量的时间来定制它的外观.此外,dropzone.js具有某些在我的ASP.NET应用程序中无法满足的配置要求.
有一个类似的问题,但没有一个正确的答案:
如何在HTML格式的表单中将文件对象设置为输入文件?
也不像上传拖放图像输入文件和预览,因为我已经实现了拖放和预览操作.我的问题是特定于在父容器中删除文件时输入空文件的问题.
我想在表单中有一个select元素,但除了下拉列表中的选项之外,能够编辑它并添加新选项而不是其他输入文本会很有用,我需要一次性完成.可能吗?
注意:
下面的答案反映了2009年遗留浏览器的状态.现在,您可以在2017年通过JavaScript实际设置文件输入元素的值.
有关详细信息和演示,请参阅此问题中的答案:
如何以编程方式设置文件输入值(即:拖放文件时)?
我有一个网站,允许用户多次上传文件进行处理.目前我有一个文件输入,但我希望能够记住用户选择并在屏幕上显示它.
我想知道怎么做是在用户选择文件后我会记住他们的选择并使用在重新加载页面时预先选择的文件重新显示文件输入.我需要知道的是如何记住和重新填充文件输入.
我也对不使用文件输入的方法持开放态度(如果可能的话).
我正在使用JQuery
如何从输入文件控件中删除一个特定的选定文件?
我有一个输入文件控件,可以选择多个文件; 但是,我想验证一个文件,如果它有一个错误的扩展名,那么我应该从文件控件本身删除该文件,是否可能?
我尝试如下
<input type="file" name="fileToUpload" id="fileToUpload" multiple/>
<script> $("#fileToUpload")[0].files[0] </script>
Run Code Online (Sandbox Code Playgroud)
下面是对象的屏幕截图,但我无法修改它

如何将blob附加到类型文件的输入
<!-- Input of type file -->
<input type="file" name="uploadedFile" id="uploadedFile" accept="image/*"><br>
Run Code Online (Sandbox Code Playgroud)
// I am getting image from webcam and converting it to a blob
function takepicture() {
canvas.width = width;
canvas.height = height;
canvas.getContext('2d').drawImage(video, 0, 1, width, height);
var data = canvas.toDataURL('image/png');
var dataURL = canvas.toDataURL();
var blob = dataURItoBlob(dataURL);
photo.setAttribute('src', data);
}
function dataURItoBlob(dataURI) {
var binary = atob(dataURI.split(',')[1]);
var array = [];
for(var i = 0; i < binary.length; i++) {
array.push(binary.charCodeAt(i));
return new Blob([new Uint8Array(array)], {type: …Run Code Online (Sandbox Code Playgroud) 我想在上传文件的ember中创建一个基本的验收测试.我可以使用Pretender模拟服务器,但我需要知道如何input type="file"使用文件系统中的文件填充字段.所以问题基本上是:
fillIn帮助器?Rails.root用于此目的.我有一个具有文件上传字段的表单页面,我试图以编程方式设置该字段的值,虽然我知道由于安全原因它是不可能的,但我想知道我们是否仍然可以?如果有插件或我可以用来执行上传的东西.我有设置该字段所需的文件字段的Base64值,我需要知道的是有没有办法设置它.
在这方面,任何建议或帮助都会很棒.
谢谢.
更新: 添加了一个JsFiddle来演示我正在尝试的内容.
请访问此网站,使用js小提琴中的示例创建一个文本文件,并使用此链接进行转换.
var str = `text`;
Run Code Online (Sandbox Code Playgroud)
http://www.motobit.com/util/base64-decoder-encoder.asp
注意:
下面的答案反映了2009年遗留浏览器的状态.现在,您可以在2017年使用JavaScript动态/编程地设置文件输入元素的值.
有关详细信息和演示,请参阅此问题中的答案:
如何以编程方式设置文件输入值(即:拖放文件时)?
javascript ×7
html ×5
jquery ×5
file-upload ×3
html5 ×2
c# ×1
dom ×1
ember-cli ×1
ember-qunit ×1
ember.js ×1
events ×1
file ×1
fileapi ×1
forms ×1
google-gears ×1
html-select ×1
multifile ×1
qunit ×1
setvalue ×1
webdriver ×1