Checking file details before submit

Checking file details before submit

Is there any way/function/script that we can use to check file details
(extension & size) before the user actually submit the form. I'm not
familiar with jquery or javascript so pls help me with that in details if
that is the solution..
I'm expecting that when user select the file, using onchange command, the
file will be checked and return 'tick' icon to show it is accepted and
return erorr msg if the size is bigger or they use other extension.
Here is the form..
<table width="809" cellpadding="2" cellspacing="2">
<tr>
<td width="252"><label for="file">Acceptance Letter from
Publisher:</label></td>
<td width="541"><input type="file" name="acceptletter" id="file"
onchange="checkFile(this.value)"></td>
</tr>
<tr>
<td width="252"><label for="file">Turnitin Similarity Report :</label></td>
<td width="541"><input type="file" name="turnitin" id="file"
onchange="checkFile(this.value)></td>
</tr>
<tr>
<td width="252"><label for="file">Paper Indexing :</label></td>
<td width="541"><input type="file" name="paperindex" id="file
onchange="checkFile(this.value)"></td>
</tr>
<tr>
<td width="252"><label for="file">Publisher's Reviewers Report
:</label></td>
<td width="541"><input type="file" name="reviwerReport"
id="file"onchange="checkFile(this.value)"></td>
</tr></table>`