Pick up input file with multiple classes

Question

I have an input file with two classes.

<input type="file" class="upload upload-logo" />
<input type="file" class="upload upload-rules" />
<input type="file" class="upload upload-image" />

I want to create a generic code for all inputs. This one works, but I have to create 1 block for each input:

$("input[class=upload-logo]").change(function() {
            ...
        });

I’ve tested it like this, but it doesn’t work:

$("input[class=upload]").change(function() {
            ...
        });

Answer 1

The way you are selecting is not the most conventional, if you want to select elements according to a class you can simply:

$('.upload').on('change', function() {
  alert($(this).prop('class')); // só a titulo de exemplo, para ver o input em que selecionou o ficheiro
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" class="upload upload-logo" />
<input type="file" class="upload upload-rules" />
<input type="file" class="upload upload-image" />

Just so we’re clear, yours wasn’t working because you weren’t using the selector correctly:

$('input[class^="upload"]').on('change', function() {
  alert($(this).prop('class')); // só a titulo de exemplo, para ver o input em que selecionou o ficheiro
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" class="upload upload-logo" />
<input type="file" class="upload upload-rules" />
<input type="file" class="upload upload-image" />

REFERENCE