Javascript: displaying images with onchange event Post: 302925508

Sponsored Content

Top Forums Programming Javascript: displaying images with onchange event Post 302925508 by Akshay Hegde on Monday 17th of November 2014 02:56:18 PM

11-17-2014

Moderator

Its due to appendChild, just replace src, validate before append whether div already exists or not

Code:

// Exists alredy then just replace src
if(document.getElementById('YourImagediv')){

  document.getElementById('YourImagediv').src = 'someimage'

}
else{

// create img div and append somewhere

}

OR

remove div before creating something like this

Code:

document.getElementById("some-element").remove()

---------- Post updated at 02:26 AM ---------- Previous update was at 02:02 AM ----------

Modify like this

Code:

function distributionChange() {
var img ;
if(document.getElementById("test"))
{
      img = document.getElementById("test")
}else
{
      img = document.createElement("img");
      img.id = "test"
      img.setAttribute("width", "320");
  document.getElementById("distribution").appendChild(img);
}

  var link = 'http://en.wikipedia.org/wiki/xxx#mediaviewer/File:yyy';

  switch (document.getElementById("distributions").value) 
  {
    case 'normal':
      img.src = link.replace("xxx", "Normal_distribution").replace("yyy", "Normal_Distribution_PDF.svg");
      break;
    case 'lognormal':
      img.src = link.replace("xxx", "Log-normal_distribution").replace("yyy", "Some_log-normal_distributions.svg");
      break;
    default:
      img.src = "Distribution not specified.";
  }

	
}

This link may be helpful Can I use... Support tables for HTML5, CSS3, etc

Akshay Hegde

View Public Profile for Akshay Hegde

Find all posts by Akshay Hegde

3 More Discussions You Might Find Interesting

1. AIX

where to get .bm or .pm images

I'm just trying to get a personal picture for a backdrop on my AIX user account at work. Where does one acquire the .bm or .pm files. How do I create them as an unpriveledged user? There are quite a few jpeg's that I would like to use.

2. UNIX for Dummies Questions & Answers

onChange + javascript in perl CGI - question

Hello all, Am trying to include a onChange java script to my perl CGI application which uses POST method to upload files to file_server This is how I embedded javascript in the perl code that renders CGI application print qq| <script type="text/javascript" src="display.js"> </script>...

3. Shell Programming and Scripting

Bash Script to find/sort/move images/duplicate images from USB drive

Ultimately, I'm looking to create a script that allows me to plug in a usb drive with lots of jpegs on it & copy them over to a folder on my hard drive. So in the process of copying I am looking to hash check them, record dupes to a file, copy only 1 of the identical files (if it doesn't exsist...

LEARN ABOUT OSX

img-xpm

img-xpm(n)																img-xpm(n)

__________________________________________________________________________________________________________________________________________________

NAME

       img-xpm - Img, X Windows Pixmap Format (xpm)

SYNOPSIS

       package require Tk

       package require img::xpm  ?1.4?

       image create photo ?name? ?options?

_________________________________________________________________

DESCRIPTION

       The  package  img::xpm  is a sub-package of Img. It can be loaded as a part of the complete Img support, via package require Img, or on its
       own, via package require img::xpm.

       Like all packages of Img it does not provide new commands, but extends the existing Tk command image so that it supports  files	containing
       raster images in the X Windows Pixmap Format (xpm). More specifically img::xpm extends Tk's photo image type.

       The name of the new format handler is xpm.  This handler does not provide additional configuration options.

       All of the above means that in a call like

       image create photo ?name? ?options?

       [1]    Image data in xpm format (options -data and -file) is detected automatically.

       [2]    The format name xpm is recognized by the option -format.

SEE ALSO

       img-bmp,  img-dted,  img-gif,  img-ico, img-intro, img-jpeg, img-pcx, img-pixmap, img-png, img-ppm, img-ps, img-raw, img-sgi, img-sun, img-
       tga, img-tiff, img-window, img-xbm, img-xpm

KEYWORDS

       image handling, tk, xpm

COPYRIGHT

       Copyright (c) 1995-2009 Jan Nijtmans <nijtmans@users.sourceforge.net>

Img									1.4								img-xpm(n)

3 More Discussions You Might Find Interesting

1. AIX

where to get .bm or .pm images

Discussion started by: trigggl

2. UNIX for Dummies Questions & Answers

onChange + javascript in perl CGI - question

Discussion started by: matrixmadhan

3. Shell Programming and Scripting

Bash Script to find/sort/move images/duplicate images from USB drive

Discussion started by: JonaQuinn

LEARN ABOUT OSX

img-xpm