有两个条件的禁用按钮

Question

l jquery禁用依赖于两个条件的按钮有问题。第一个条件是用户必须选择一个选项。第二个条件是用户必须上传文件。我尝试写入第一个条件，但代码不能很好地工作

这里是形式上传的文件

<form action="{{route('filestest')}}" method="post" enctype="multipart/form-data"> 

    {{csrf_field()}} 

    <input id="file-id"type="file" name="file1" ></input> 

这是我想禁用它一个按钮的代码的代码，如果这两个条件无效

<button class="enableOnInput"type="submit" value="Submit" id="submitorder" disabled="disabled">send file</button> 

，这是使用户列表中的代码，以选择一个选项

<select id="select-id" name="select-name" > 
    <option value="" selected="selected" ></option> 
    <option value="cr">Course Report. </option> 
    <option value="st" >Students' Sample of Test (Final Exam).(Highest)</option> 
</select> 

这里是JavaScript代码来禁用发送文件按钮，只有第一个条件。

<script type="text/javascript"src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript" > 
$(function(){ 
    $('#select-id').keyup(function(){ 
    if($(this).val() == ''){ 
$('.enableOnInput').prop('disabled',true); 
    }else{ 
     $('.enableOnInput').prop('disabled', false); 
    } 
    }); 
}); 
</script> 

Answer 1

这将检查并确保这两个条件。 （也确实注意到，你应该使用change()，而不是keyup()）

$(function() { 
 
    $('#select-id, #file-id').change(function() { 
 
    $('.enableOnInput').prop('disabled', !($('#select-id option:selected').val() != '' && $('#file-id').val() != '')); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="file-id" type="file" name="file1"></input> 
 

 
<button class="enableOnInput" type="submit" value="Submit" id="submitorder" disabled="disabled">send file</button> 
 

 
<select id="select-id" name="select-name"> 
 
    <option value="" selected="selected" ></option> 
 
    <option value="cr">Course Report. </option> 
 
    <option value="st" >Students' Sample of Test (Final Exam).(Highest)</option> 
 
</select>

Answer 2

变化事件监听器change()事件不keyup，该KEYUP从用户监听键盘输入，不适用于选择

$(function(){ 
 
    $('#select-id, #file-id').change(function(){ 
 
    
 
    $('.enableOnInput').prop('disabled',($('#select-id').val() == '' || $('#file-id').val() == '')); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="select-id" name="select-name" > 
 
    <option value="" selected="selected" ></option> 
 
    <option value="cr">Course Report. </option> 
 
    <option value="st" >Students' Sample of Test (Final Exam).(Highest)</option> 
 
</select> 
 

 
<input id="file-id" type="file" name="file1" ></input> 
 

 
<button class="enableOnInput"type="submit" value="Submit" id="submitorder" disabled="disabled">send file</button>