javascript - Image resizing giving error(srcImg.attr)is not a function? -
here i'm uploading image , in text boxes giving new width , height when submit original image size has alter according new width , height , save in same folder.but not working how can this,anybody help me please?
<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>demo</title> <script> function imageresizer() { var srcimg = document.getelementbyid("imgid").value; var newimg = new image(); newimg.src = srcimg.attr('src'); var height = newimg.height; var width = newimg.width; var newwidth = document.getelementbyid("widthid").value; var newheight = document.getelementbyid("heightid").value; } </script> </head> <body> <% out.println("<table>"); out.println("<tr><td><input type='file' id='imgid'></td></tr>"); out.println("<tr><td>enter new width:</td><td><input type='text' id='widthid'></td></tr>"); out.println("<tr><td>enter new height:</td><td><input type='text' id='heightid'></td></tr>"); out.println("<tr><td><input type='button' value='submit' onclick='imageresizer()'></td></tr>"); out.println("</table>"); %> </body> demo.jsp page,where i'm uploading image , want resize uploaded image new height , width.
that's because srcimg contains value of input not input itself. you're trying access attr of value undefined . instead use
newimg.src = srcimg; // srcimg contains value of input if want input use:
var srcimg = document.getelementbyid("imgid"); modified js function:
function imageresizer() { console.log('called'); var srcimg = document.getelementbyid("imgid").value; var newimg = new image(); newimg.src = srcimg; var height = newimg.height; var width = newimg.width; var newwidth = document.getelementbyid("widthid").value; var newheight = document.getelementbyid("heightid").value; console.log(newimg, srcimg, newwidth, newheight, height, width); } demo: http://jsfiddle.net/lotusgodkk/gcu2d/182/
javascript image jsp upload resize-image
No comments:
Post a Comment