我在上传之前有用户所选图片的缩略图预览。它还允许用户使用jQuery UI重新排列图像的顺序。我想通过为包含div的每个缩略图添加唯一ID来跟踪图像的顺序,但我无法生成唯一ID。见下面的代码。理想情况下,我希望div ID与图像名称匹配,因此在表单发布后,我使用它来匹配IEnumerable<HttpPostedFileBase>
中的文件名。例如,如果上传的图片被称为pic1.jpg
,则包含缩略图的div
将为<div id = "pic1">
。有问题的行似乎是div.id = File.name
,但我无法生成任何类型的唯一ID?
CODE
//jQuery UI sort
$(function () {
$("#upload-thumbnails").sortable();
$("#upload-thumbnails").disableSelection();
});
//Thumbnail preview
jQuery(function ($) {
var filesInput = document.getElementById("ImageUploads");
filesInput.addEventListener("change", function (event) {
var files = event.target.files; //FileList object
var output = document.getElementById("upload-thumbnails");
for (var i = 0; i < files.length; i++) {
var file = files[i];
var picReader = new FileReader();
picReader.addEventListener("load", function (event) {
var picFile = event.target;
var div = document.createElement("div");
div.id = File.name;
div.innerHTML = "<img class='thumbnail' src='" + picFile.result + "'" +
"title='" + picFile.name + "'/><a href='#' class='remove_pict'>Remove</a>";
output.insertBefore(div, null);
div.children[1].addEventListener("click", function (event) {
div.parentNode.removeChild(div);
});
});
//Read the image
picReader.readAsDataURL(file);
}
}); });
答案 0 :(得分:0)
在大多数情况下,当我们上传图片时,由于其独特性,我们将它们重命名为时间戳。但是对于搜索,处理时间戳要困难得多,然后添加div的类名作为文件名。
var options = {
host: 'https://###############.herokuapp.com',
port: 443,
path: '/parse/functions/'+req.param('text'),
method: 'POST',
headers: {
'X-Parse-Application-Id': '##############',
'X-Parse-REST-API-Key': '###########'
}
};
https.get(options, function(resp){
resp.on('data', function(chunk){
//do something with chunk
res.send(chunk)
});
}).on("error", function(e){
console.log("Got error: " + e.message);
res.send(e)
});
我相信这将是完整的帮助。 感谢
答案 1 :(得分:0)
不确定我是否得到了问题:)
尝试改为:
$(div).attr('id', 'yourIDHere')
或者你永远不会使用你定义的var文件,不是吗?
div.id = file.name;
您可以通过JS生成UUID,请参阅here