如何预览宽500px的图像。 只要 ？ ， 我能怎么做？

Question

..........................................................................................

Why image still preview when image not width 500 px. , How can i do ?

..........................................................................................

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<?PHP // start script for preview image before upload // ?>
<script language="JavaScript">
    function showPreview_1(ele)
    {
            $('#imgAvatar_1').attr('src', ele.value); // for IE
            if (ele.files && ele.files[0]) {

                var reader = new FileReader();              
                reader.onload = function (e) {
                    $('#imgAvatar_1').attr('src', e.target.result);
                }
                reader.readAsDataURL(ele.files[0]);
            }
    }
</script>
<?PHP // end script for preview image before upload // ?>


Thumbnail image : 
<img id="imgAvatar_1" style=" max-height: 100px; max-width: 100px; border: 1px solid #ccc;" >
<input name="offer_image_1" type="file" id="offer_image_1" OnChange="showPreview_1(this)" />





<?PHP // start script for check wide image before upload // ?>
<script type="text/javascript">
var _URL = window.URL || window.webkitURL;
$("#offer_image_1").change(function(e) {
    var offer_image_1, img;
    if ((offer_image_1 = this.files[0])) {
        img = new Image();
        img.onload = function() {
            if (this.width != '500')
            {
            alert("not width 500 px.");
            $('input').val("");
            }
        };
        img.src = _URL.createObjectURL(offer_image_1);
    }
});
</script>
<?PHP // end script for check wide image before upload // ?>

Answer 1

Put

img.src = _URL.createObjectURL(offer_image_1);

line in else part for

if (this.width != '500')
{
    alert("not width 500 px.");
    $('input').val("");
}

It is being shown because you are setting the image source no matter whatever the width is. Hope this helps.