我是一个使用Javascript的新手,并被提出这种问题。我必须获取PHP目录中的所有文件,然后必须在两个HTML <select>
列表中列出这些文件。第一个包含我在目录中找到的文件的扩展名,而第二个包含完整的文件名。当我选择扩展名(第一个选择中具有onchange)时,必须从第二个<select>
中删除所有不具有该扩展名的文件。事情应该像这样工作:我选择“ jpg”,所有不是.jpg文件的文件都必须从第二个选择中删除。我做了一个功能来管理这个,但是它并不能正常工作。在这里,我发布了我编写的代码:
echo("function visible_selection(){
var ext = document.getElementById(\"ext\");
var slen = document.getElementById(\"files\").length;
var selected = ext.options[ext.selectedIndex].text;
var filez = document.getElementById(\"files\");
for(var i=0; i < slen; i++){
var vdump = filez.options[i].text;
var xcase = vdump.split(\".\");
if (!vdump.includes(selected) && xcase[1] != selected){
filez.remove(i);
}
}
filez.style.display = \"inline\";
}");
ext显然是包含扩展名的第一个<select>
,而文件是包含完整文件名的第二个。我的问题是,如何正确检查扩展名是否包含在文件名中,从而删除没有这种扩展名的文件?
答案 0 :(得分:0)
-编辑。对@David表示歉意。我念念名字。谢谢您的帮助。
感谢@CBCrusher分解了调试问题的步骤。
随着OP将问题缩小到for循环,我将提供一个可行的示例。
您当前正在从0->长度循环遍历数组。但是,您要删除循环中的元素,这将更改数组的长度(使您越界错误)。诀窍是向后遍历数组。
function visible_selection() {
var ext = document.getElementById("ext");
var slen = document.getElementById("files").length;
var selected = ext.options[ext.selectedIndex].text;
var filez = document.getElementById("files");
for (var i = slen - 1; i >= 0; i--) {
var vdump = filez.options[i].text;
var xcase = vdump.split(".");
if (!vdump.includes(selected) && xcase[1] != selected) {
filez.remove(i);
}
}
filez.style.display = "inline";
}
document.getElementById("ext").onchange = () => {
visible_selection()
}
<label for="ext">Extentions:</label>
<select id="ext">
<option disabled selected value> -- select an extention -- </option>
<option value=".jpeg">.jpeg</option>
<option value=".png">.png</option>
<option value=".pdf">.pdf</option>
</select>
<label for="files">Files:</label>
<select id="files">
<option disabled selected value> -- all files -- </option>
<option value="File1.jpeg">File1.jpeg</option>
<option value="Fiel2.jpeg">Fiel2.jpeg</option>
<option value="Fiel3.png">Fiel3.png</option>
<option value="Fiel4.pdf">Fiel4.pdf</option>
<option value="Fiel5.pdf">Fiel5.pdf</option>
</select>