如何通过jQuery上传图片？
在过去的几天里，我一直在努力用jQuery和AJAX提交表单。我面临的问题是在表单字段中上传图像。
我的表格是这样的：
<form action="#" method="GET" role="form" enctype="multipart/form-data">
<input type="text" placeholder="Name" name="name">
<input type="file" name="img" multiple>
<button type="submit">Submit </button>
</form>
我的用于获取表单值的jQuery脚本如下所示：
$("form").submit(function (event) {
$.dataArray = $(this).serializeArray(); // array of form data
console.log($.dataArray);
event.preventDefault();
});
但是，如果image返回null，则返回除image 1以外的所有字段值。
如何存储在数据数组中？
我要存储，以便可以通过AJAX将值发送到服务器。
问题答案：
对于上传单个图像，像这样
<html>
<head>
<meta charset="UTF-8">
<title>AJAX image upload with, jQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function (e) {
$('#upload').on('click', function () {
var file_data = $('#file').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: 'http://localhost/ci/index.php/welcome/upload', // point to server-side controller method
dataType: 'text', // what to expect back from the server
cache: false,
contentType: false,
processData: false,
data: form_data,
type: 'post',
success: function (response) {
$('#msg').html(response); // display success response from the server
},
error: function (response) {
$('#msg').html(response); // display error response from the server
}
});
});
});
</script>
</head>
<body>
<p id="msg"></p>
<input type="file" id="file" name="file" multiple />
<button id="upload">Upload</button>
</body>
</html>
对于多张图片，您将不得不循环不同的内容
-
我目前通过AJAX发布我的表单，代码如下： 现在，我想添加以相同形式上传图片的功能，并在这个JQUERY和相同的服务器端脚本中实现它。我唯一的问题是，我不知道怎么做…我测试了上面的代码，发现它没有将$_files-变量传递给服务器端脚本。 谁能带领我在任何方向，我需要做的，以增加与此脚本图像上传的可能性？
-
问题内容： 我想先预览图像，然后再将其上传到服务器。我已经为其编写了一些代码，但是由于某种安全原因，它只能在Internet Explorer中预览，而不能在其他浏览器（如Safari，Chrome，Firefox）中预览。有什么解决方案可以在这些浏览器中预览图像吗？ 问题答案： 对于Firefox。由于安全原因，它的路径被截断了。但是，他们提供了其他方法： 以下内容适用于Internet Exp
-
我正在尝试通过ACTION\u SEND intent将文件上载到webview应用程序。如果他们选择在应用程序中使用openFileChooser上传文件，我已经可以使用它了，但我需要它在他们单击文档或画廊应用程序中的共享时工作。所以，我非常需要绕过openFileChooser，因为已经选择的文件及其Uri在我的意图中，我只需要实际上传它。我想重蹈openFileChooser的覆辙，但不知道
-
问题内容： 我无法通过ajax上传多个文件。这是我的代码。 HTML代码： Ajax代码：- 当我通过Ajax调用upload_business_photo_do（）函数时，它无法获取图像$ _FILES [‘file’] [‘name’]的名称 问题答案： 尝试这样使用，它简单又容易 并在控制器中使用像这样 并使用此功能将文件数据转换为多个图像数据的数组 它的工作完美，只需尝试使用它。您无需使用
-
可能的重复： 这个
-
问题内容： 我发现用AJAX上传图像似乎不符合表单中指定的multipart，因为我检查它是否为multipart（）的代码从不工作（在Java中）。 我有这个HTML表单： 以下是我的ajax代码，该代码将图像发送到地址处的上传处理程序。我的Java代码中的uploadPost（）方法首先确定上传是否为多部分，但是，似乎ajax不会将图像作为多部分发送。是否因为我在表单上使用了jQuery的se