<html>
<body>
<div align="center">
<form name="imageTest">
<input type="file" name="myImage" size="30"/>
<input type="button" value="Preview!" onClick="previewImage(document.imageTest.myImage,'replaceMe')"/><br>
<img src="MyImg.jpg" name="replaceMe" id="replaceMe"/>
</form>
</div>
</body>
</html>

<script language="javascript">
var imgRe = /^.+\.(jpg|jpeg|gif|png)$/i;
function previewImage(pathField, previewName)
{

var path = pathField.value;
if (path.search(imgRe) != -1)
{
//document[previewName].src = document.imageTest.myImage.value;
document.getElementById("replaceMe").src = document.imageTest.myImage.value;
}
else
{
alert("JPG, PNG, and GIFs only!");
}

}
</script>

The above code Not work in Crome and IE.

Can you please tell me y?

I Think these Browsers do not allow Javascript to access local resources. Chrome Error:

Not allowed to load local resource: file:///C:/fakepath/DSC00053.JPG

I Think these Browsers do not allow Javascript to access local resources. Chrome Error:

Not allowed to load local resource: file:///C:/fakepath/DSC00053.JPG

Can we do something to fix it?

Thank you!

You have to use a PHP File Upload Script, so the file is uploaded to your Server, and then included in the <img>-tag. I don't know another method.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.