我试图显示第一个列表项,然后当第一个输入文件选择了一个文件时,我想显示下一个列表项等等,我一直遇到这个问题。我应该如何处理这个问题?
<li id="0"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="1"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="2"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="3"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="4"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="5"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="6"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="7"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="8"><input size="30" name="images[]" class="my-input-file" type="file"></li>
<li id="9"><input size="30" name="images[]" class="my-input-file" type="file"></li>
最佳答案
最初隐藏所有输入元素,然后将事件监听器附加到输入元素。如果指定了文件,您将显示父 li
元素的下一个同级元素。
$('ul>li:not(:first)').hide();
$('ul>li>input').on('change', function () {
if (this.value) {
$(this).parent().next().show();
}
});
<小时/>
如果您想确定先前显示的元素之一是否发生更改并且文件未被选择,您可以使用以下命令:
$('ul>li:not(:first)').hide();
$('ul>li>input').on('change', function () {
if (this.value) {
$(this).parent().next().show();
}
$(this).closest('ul').find('li').prevAll().find('input').filter(function () {
return !this.value;
}).parent().nextAll().hide();
});
关于javascript - 当前文件输入有一个文件后显示下一个文件输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28651572/