Answers for "input file type image"

21

accept only image files upload html

<input type="file" name="myImage" accept="image/x-png,image/gif,image/jpeg" />
Posted by: Guest on February-19-2020
7

input type="file" and display image

<p><input type="file"  accept="image/*" name="image" id="file"  onchange="loadFile(event)" style="display: none;"></p>
<p><label for="file" style="cursor: pointer;">Upload Image</label></p>
<p><img id="output" width="200" /></p>

<script>
var loadFile = function(event) {
	var image = document.getElementById('output');
	image.src = URL.createObjectURL(event.target.files[0]);
};
</script>
Posted by: Guest on June-08-2020
1

input type file select only video

accept="video/mp4,video/x-m4v,video/*"
Posted by: Guest on October-14-2020
0

using input file as html image source

$('document').ready(function () {
    $("#imgload").change(function () {
        if (this.files && this.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#imgshow').attr('src', e.target.result);
            }
            reader.readAsDataURL(this.files[0]);
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="imgload" >
<img src="#" id="imgshow" align="left">
Posted by: Guest on September-14-2020

Browse Popular Code Answers by Language