javascript - Javascript:如果输入值等于文件名,则上传所有文件。单击上传按钮时,在每个输入字段下附加所有相关文件
问题描述
当用户插入一个值并点击上传文档时,如果前3个单词的值等于文件名,则应该上传输入字段下的所有相关文档。所有文件均按命名约定。请参阅上传的图片。我已经动态创建了输入字段,但可以在每个动态输入字段下附加选定的文件。[在此处输入图片描述][1]
<div class="card">
<div class="card-body">
<div class="row text-right">
<div class="col-md-12">
<input type="file" multiple="multiple" id="uploadFile1" onclick="uploaddocs()"/>
<a href="#" class="btn btn-primary add-field" onclick="addtempfield()" ><i class="fas fa plus"></i> Add Item</a>
</div>
</div>
<ol class="agenda-wrappe"></ol>
</div>
</div>
function addtempfield(){
$(".agenda-wrapper").append(`<li>
<div class="form-group mt-2 d-flex align-items-center" id="me">
<input type="text" class="form-control" id="item1" name="filter[]">
<i class="fas fa-times ml-2 delete-input remove_field"></i>
</div>
</li>`
);
$(".agenda-wrapper").on("click",".remove_field", function(e){
e.preventDefault();
$(this).parents('li').remove();
})
}
function uploaddocs(){
$('#uploadFile1').change(function(e){
//Get all docs in an Array
let storeDoc = [];
let fileName = e.target.files;
for(let i = 0; i<fileName.length; i++){
//let filecontainer = fileName[i].name.split('_').slice(0,3).join('_');
let filesplit = fileName[i].name;
//let filesplit = fileName[i].name;
storeDoc.push({filesplit});
}
console.log(storeDoc);
var element = document.getElementsByName("filter[]");
for (let i = 0; i < element.length; i++){
for(let x = 0; x < storeDoc.length; x++){
//console.log(storeDoc[x].filesplit);
if(element[i].value.split(' ').slice(0, 3).join('_') ==
storeDoc[x].filesplit.split('_').slice(0,3).join('_')){[enter image description here][2]
// $(".listdoc").append(`<p>${storeDoc[x].filesplit}<p>`);
//am stuck here
}
}
}
});
[1]: https://i.stack.imgur.com/bifQN.png
[2]: https://i.stack.imgur.com/wOccR.png
解决方案
推荐阅读
- linux - 无法在 Linux 主机和 Linux VMware Workstation 来宾之间剪切和粘贴
- javascript - 我在 vs 代码上安装 create-react-app 但由于互联网问题安装停止,当我安装此错误时
- javascript - React App 没有编译我的图像或视频
- javascript - 所有选项卡上的 Window.onUnload
- java - 将 0 或 1 移到一侧,移位次数较少
- macos - How to retrieve the XPC service of a file provider extension on macOS?
- google-maps - 位置更改时如何在简历上刷新谷歌地图标记?
- java - 如何创建低分跟踪器?
- cefsharp - 保存 CefSharp cookie 的最佳位置?
- python - Discord.py 向特定用户 ID 发送 DM