<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<style>
input {
display: block;
visibility: hidden;
width: 0;
height: 0;
}
</style>
</head>
<body>
<h1>upload to using button</h1>
<input type="file" name="somename" size="chars">
<button>Choose File</button>
<script>
$('button').click(function(){
$('input').click();
});
</script>
<h1>upload to using text</h1>
<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>
</body>
</html>
Comments
Post a Comment