尺寸检查后避免图像显示

I don't want to display image if image size is greater than 1mb

called CheckSelfImage() on onchange event of input type file.

if($qy_emp3['KYC'] == 'Rejected' or $qy_emp3['KYC'] == 'No' or $qy_emp3['KYC'] == "")

Code:

?>
<form name="atc" action="<?=$_SERVER['PHP_SELF']?>" method="post" onsubmit="return validateForm()" enctype="multipart/form-data">   
<input type="hidden" name="SelfImageName" value="<? echo $qy_emp3['SelfImage'];?>" />
<input type="hidden" name="PanImageName" value="<? echo $qy_emp3['PanImage'];?>" />
<input type="hidden" name="AadhaarImageName" value="<? echo $qy_emp3['AadhaarImage'];?>" />
<input type="hidden" name="AadhaarImageBackName" value="<? echo $qy_emp3['AadhaarImageBack'];?>" />
<input type="hidden" name="CancelChequeImageName" value="<? echo $qy_emp3['CancelChequeImage'];?>" />
<div class="col-lg-12">
<div class="col-md-6 paddt">
<p class="font-600 m-b-5">Upload Your Picture(<b>max size upto 1MB</b>)            </p>
<input type="file" name="SelfImage" id="SelfImage" class="form-control" onchange="CheckSelfImage();" />
</div>
<div class="col-md-6 paddt">
<p class="font-600 m-b-5"></p>
<img id="SelfImageShow" src="#" alt="Image Preview" height="200px" width="200px" />
<?
if($qy_emp3['SelfImage'] != "")
{
?>
<a href="images/<? echo $qy_emp3['SelfImage'];?>" target="_blank">
<img src="images/<? echo $qy_emp3['SelfImage'];?>" alt="Current Image" height="200px" width="200px" />
</a>
<?
}
else
{
?>
<img src="images/<? echo $qy_emp3['SelfImage'];?>" alt="Current Image" height="200px" width="200px" />
<?
}
?>          
</div>
</div>
</form>
function CheckSelfImage()
{
var selfsize = 1048576;
var file_size=document.getElementById('SelfImage').files[0].size;
if(file_size>=selfsize)
{
alert('Self Image File size is too large.');
document.getElementById('SelfImageShow').value="";
return false;
}  
}

image not to displayed after oversize message

You are trying to make the value as blank or null. Actually you have to set the attribute of image called src as the null value.

    ?>
    <form name="atc" action="<?=$_SERVER['PHP_SELF']?>" method="post" onsubmit="return validateForm()" enctype="multipart/form-data">   
    <input type="hidden" name="SelfImageName" value="<? echo $qy_emp3['SelfImage'];?>" />
    <input type="hidden" name="PanImageName" value="<? echo $qy_emp3['PanImage'];?>" />
    <input type="hidden" name="AadhaarImageName" value="<? echo $qy_emp3['AadhaarImage'];?>" />
    <input type="hidden" name="AadhaarImageBackName" value="<? echo $qy_emp3['AadhaarImageBack'];?>" />
    <input type="hidden" name="CancelChequeImageName" value="<? echo $qy_emp3['CancelChequeImage'];?>" />
    <div class="col-lg-12">
        <div class="col-md-6 paddt">
            <p class="font-600 m-b-5">Upload Your Picture(<b>max size upto 1MB</b>)            </p>
            <input type="file" name="SelfImage" id="SelfImage" class="form-control" onchange="CheckSelfImage();" />
        </div>
        <div class="col-md-6 paddt">
            <p class="font-600 m-b-5"></p>
            <img id="SelfImageShow" src="#" alt="Image Preview" height="200px" width="200px" />
            <?
            if($qy_emp3['SelfImage'] != "")
            {
            ?>
            <a href="images/<? echo $qy_emp3['SelfImage'];?>" target="_blank">
            <img src="images/<? echo $qy_emp3['SelfImage'];?>" alt="Current Image" height="200px" width="200px" />
            </a>
            <?
            }
            else
            {
            ?>
            <img src="images/<? echo $qy_emp3['SelfImage'];?>" alt="Current Image" height="200px" width="200px" />
            <?
            }
            ?>          
        </div>
    </div>
</form>
function CheckSelfImage()
{
var selfsize = 1048576;
var file_size=document.getElementById('SelfImage').files[0].size;
if(file_size>=selfsize)
{
alert('Self Image File size is too large.');
$("SelfImageShow").attr("src","");
return false;
}  
}