jQuery-如何在另一个元素有值时显示该元素

目前我有3个上传按钮。我想要的是，当用户用第一个按钮选择一个文件时，它会显示下一个按钮以允许他们上传另一个文件，依此类推

我已经知道如何在选择文件名后显示该文件名，但我无法知道如何在有值时显示“下一步”按钮

下面是一个小提琴演示：

jQuery

$(function() {
    $("#vfb-7").change(function (){
        var fileName = $(this).val();
        $("#filename-7").html(fileName);
    });
});
$(function() {
    $("#vfb-20").change(function (){
        var fileName2 = $(this).val();
        $("#filename-20").html(fileName2);
    });
});
$(function() {
    $("#vfb-21").change(function (){
        var fileName3 = $(this).val();
        $("#filename-21").html(fileName3);
    });
});

HTML

<ul>
    <li id="item-vfb-7" class="vfb-item vfb-item-file-upload  ">
    <label class="vfb-desc" for="vfb-7">
      File Upload 
    </label>
    <div class="upload">
        <input id="vfb-7" class="vfb-text  vfb-large    upload  {accept:'png|jpe?g|gif'}" type="file" value="" multiple="" name="vfb-7"></input>
    </div>
    <span id="filename-7" class="filename"></span>
</li>
<li id="item-vfb-20" class="vfb-item vfb-item-file-upload  ">
    <label class="vfb-desc" for="vfb-20">
      File Upload 
    </label>
    <div class="upload">
        <input id="vfb-20" class="vfb-text  vfb-large    upload  {accept:'png|jpe?g|gif'}" type="file" value="" multiple="" name="vfb-20"></input>
    </div>
    <span id="filename-20" class="filename"></span>
</li>
<li id="item-vfb-21" class="vfb-item vfb-item-file-upload  ">
    <label class="vfb-desc" for="vfb-21">
      File Upload 
    </label>
    <div class="upload">
        <input id="vfb-21" class="vfb-text  vfb-large    upload  {accept:'png|jpe?g|gif'}" type="file" value="" multiple="" name="vfb-21"></input>
    </div>
    <span id="filename-21" class="filename"></span>
</li>
</ul>

提前感谢你的帮助

亚历克斯像这样-

$(function () {
    $("#vfb-7").change(function () {
        var fileName = $(this).val();
        $("#filename-7").html(fileName);
        if (filename === "someName") {    
           $(this).closest('li').next('li').show();
        }
    });
});

演示

-->

---

您好，谢谢您的快速回复，这非常有效。只是出于好奇，if语句中发生了什么？您是否检查过如果我再次单击上一个选定的文件并取消对话框。。以前选择的文件路径丢失。

$(function () {
    $("#vfb-7").change(function () {
        var fileName = $(this).val();
        $("#filename-7").html(fileName);
        if (filename === "someName") {    
           $(this).closest('li').next('li').show();
        }
    });
});

$(function () {
    $("#vfb-7").on('change', function () {
        var fileName = this.value;
        $("#filename-7").html(fileName);
        if (fileName.length) $("#item-vfb-20").show();
    });


    $("#vfb-20").on('change', function () {
        var fileName2 = this.value;
        $("#filename-20").html(fileName2);
        if (fileName2.length) $("#item-vfb-21").show();
    });


    $("#vfb-21").on('change', function () {
        var fileName3 = this.value;
        $("#filename-21").html(fileName3);
    });
});

$("#vfb-7").change(function () {
                var fileName = $(this).val();
                $("#filename-7").html(fileName);
                if (fileName != "") $(this).closest('li').next('li').show();
            });