View Full Version : Unable to call Javascript Function which written using innerHTML method.

07-25-2011, 09:45 AM
Hi ,

I am inserting an image into a span tag by click on button and resize the image using resize_image_height_weight function.
I am using two function to do this task.

setImage function resize the image but fail on w3validation on my webpage( As per w3c there is no attribute onload for image tag.) To fix out this issue I am using setImage_w3Validation function which pass on w3validation but unable to call resize_image_height_weight function.

My purpose is to resize the image.

Kindly suggest me how to do it?

<script TYPE="text/javascript" language="javascript">

function resize_image_height_weight(id, hgt, wdth){
myImage = new Image();
myImage.src = Obj.src;
var heights = myImage.height;
var widths = myImage.width;
// alert("Height=>" + heights + " Width=> " + widths);

if(heights > hgt || widths > wdth)
if(heights > widths)
var temp = heights/hgt;
var new_width = widths / temp;
new_width = parseInt(new_width);
heights = hgt;
widths = new_width;
var temp = widths/wdth;
var new_height = heights / temp;
new_height = parseInt(new_height);
heights = new_height;
widths = wdth;
Obj.height = heights;
Obj.width = widths;


function setImage(){
document.getElementById("IM0").innerHTML ="<center><img src=\"http://www.google.co.in/intl/en_com/images/srpr/logo1w.png\" id=\"img1\" alt=\"\" height=\"125\" width=\"125\" onload=\"resize_image_height_weight('img1',125,125);\"><\/center>";

function setImage_w3Validation(){
document.getElementById("IM1").innerHTML ="<center><img src=\"http://www.google.co.in/intl/en_com/images/srpr/logo1w.png\" id=\"img2\" alt=\"\" height=\"125\" width=\"125\"><script type=\"text/javascript\">document.getElementById('img2').onload = function(){resize_image_height_weight('i12',125,125);};<\/SCRIPT><\/center>";
//I wanna to do the task using this one function to resize img for w3validation
function clear_page(){
document.getElementById("IM0").innerHTML ="";
document.getElementById("IM1").innerHTML ="";
<div class="img3"><span id="IM0"></span></div>
<div class="img3"><span id="IM1"></span></div>
<input type="button" name="btn1" value="Image Onload W3C Fail" onclick="setImage();">
<input type="button" name="btn2" value="Image Onload W3C Pass" onclick="setImage_w3Validation();">
<input type="button" name="btn2" value="Clear" onclick="clear_page();">

Logic Ali
07-25-2011, 11:30 AM
Do not speciify src until the onload handler is installed.

07-26-2011, 07:15 AM
Do not speciify src until the onload handler is installed.

Hi Logic Ali,

Thanks for reply.

I am not clear what do you mean??? Could you explain in detail.