Tuesday 27 December 2016

jQuery Display Image Based on Image URL with Example

In jQuery to display image based on the image url entered in textbox we need to write the code like as shown below


<script type="text/javascript">
$(function () {
$('#btnShow').click(function () {
$("#imgTest").attr("src", $("#txtUrl").val());
})
})
</script>

If you want complete example to show the image based on the image url entered in textbox we need to write the code like as shown below

<html>
<head>
<title> jquery show image from url entered in textbox </title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function () {
$('#btnShow').click(function () {
$("#imgTest").attr("src", $("#txtUrl").val());
})
})
</script>
</head>
<body>
<div>
Enter Image URL:<input type="text" id="txtUrl" /> <input type="button" id="btnShow" value ="Show Image" />
</div><br />
<img id="imgTest" />
</body>
</html>



No comments:

Post a Comment