javascript - 如何验证用户是否选择了要上传的文件？

Question

我需要使用 JavaScript/jQuery 进行表单验证。我的表单有一个输入字段，用户可以在其中上传文件，还有一张表，其中 <td>是输入字段。像这样:

 <input type="file" name="file" class="filestyle" id="fajl" data-icon="false" accept=".pdf,.csv,.xlsx">

还有这个:

<table class="table table-bordered table-hover ">
<tbody>
<tr id="prvi_red">
<td><input type="text" name="user1_name" class="form-control" placeholder="12121212" required></td>
<td><input type="text" name="user1_surname" class="form-control" placeholder="Text" required></td>
<td><input type="text" name="user1_email" class="form-control" placeholder="Number" required></td>
</tr>

而且我还有一个按钮可以提交整个表单(上传的文件和手动插入到表中)。我尝试使用 Parsley.js 验证这样的表单验证插件:

$(document).ready(function(){
    $('#form1').submit(function(){
        if(($('#fajl').val()=='')){
            console.log('ovdje sam');
            var validateForm = $('#prvi_red').parsley().validate();
            if(validateForm){
                //do something
            }
        }
    });
});

还有这个:

$(document).ready(function(){
    $('#buton').click(function(){//when submit button is clicked
        if(($('#fajl').val()=='')){
            console.log('ovdje sam');
            var validateForm = $('#prvi_red').parsley().validate();
            if(validateForm){
                //do something
            }
        }
    });
});

正如您所看到的，我想要实现的是在文件未上传的情况下对表输入字段进行验证。但在这两种情况下，上面的代码都没有发生任何事情。我试图输入 console.log('ovdje sam');只是为了测试脚本是否到达该部分，但这也不会显示在控制台中。非常欢迎任何帮助。

Answer 1

最好的方法是在用户指定文件时删除 required 属性。监听文件输入上的 input 事件并相应地更新其他输入。当它们更新时，您应该触发 'input' (或调用 parsley().validate())，以便删除显示的任何错误消息。