2 Replies - 879 Views - Last Post: 11 March 2013 - 12:42 PM

#1 Thorax_Great  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 10
  • Joined: 02-April 12

Swapping Images with onclick

Posted 11 March 2013 - 10:25 AM

I'm supposed to create a page where clicking on a radio button changes the flag to the country currently selected(E.g. Australia = Australian flag). I'm using the onclick methods below:
    	    <input type="radio" name="flag" value="arge" id="arg" onclick="arg()">:Argentina<br>
            <input type="radio" name="flag" value="aust" id="aus" onclick="aus()">:Australia<br>
            <input type="radio" name="flag" value="boli"id="bol" onclick="bol()">:Bolivia<br>
            <input type="radio" name="flag" value="cuba" id="cuba" onclick="cuba()">:Cube<br>
            <input type="radio" name="flag" value="finl" id="fin" onclick="fin()">:Finland<br>
            <input type="radio" name="flag" value="fran" id="fra" onclick="fra()">:France<br>
            <input type="radio" name="flag" value="itat" id="ita" onclick="ita()">:Italy<br>
            <input type="radio" name="flag" value="peru" id="peru" onclick="peru()">:Peru<br>
            <input type="radio" name="flag" value="syri" id="syr" onclick="syr()">:Syria<br>
            <input type="radio" name="flag" value="tunis" id="tuni" onclick="tuni()">:Tunisia<br>


to run simple functions in Javascript:
<script type="javascript">
	function arg(){
		document.getElementById("image").src="argentina.jpg";
	}
	function aus(){
		document.getElementById("image").src="australia.jpg";
	}
	function bol(){
		document.getElementById("image").src="bolivia.jpg";
	}
	function cuba(){
		document.getElementById("image").src="cuba.jpg";
	}
	function fin(){
		document.getElementById("image").src="finland.jpg";
	}
	function fra(){
		document.getElementById("image").src="france.jpg";
	}
	function ita(){
		document.getElementById("image").src="italy.jpg";
	}
	function peru(){
		document.getElementById("image").src="peru.jpg";
	}
	function syr(){
		document.getElementById("image").src="syria.jpg";
	}
	function tuni(){
		document.getElementById("image").src="tunisia.jpg";
	}
</script>


Though whenever click on the buttons nothing happens. Any suggestions?

Full code
Spoiler


Is This A Good Question/Topic? 0
  • +

Replies To: Swapping Images with onclick

#2 andrewsw  Icon User is offline

  • It's just been revoked!
  • member icon

Reputation: 3734
  • View blog
  • Posts: 13,054
  • Joined: 12-December 12

Re: Swapping Images with onclick

Posted 11 March 2013 - 11:30 AM

A scripts' type is text/javascript.

Is the script in the same page?

What does your browsers' Console say? What error message(s) does it show? If you don't know what the Console is, there are links in my signature.
Was This Post Helpful? 0
  • +
  • -

#3 Koyume  Icon User is offline

  • D.I.C Head

Reputation: 15
  • View blog
  • Posts: 89
  • Joined: 19-February 13

Re: Swapping Images with onclick

Posted 11 March 2013 - 12:42 PM

View Postandrewsw, on 11 March 2013 - 12:30 PM, said:

A scripts' type is text/javascript.

Is the script in the same page?

What does your browsers' Console say? What error message(s) does it show? If you don't know what the Console is, there are links in my signature.


To expand a bit on andrewsw, Is your images in the same folder as your HTML file?

I am thinking, as I am looking at your code, the type might be causing the problem as well. But as was stated, without the full error, we can only guess.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1