Javascript help please! (Return/function question)

Miscellaneous Forums/General Discussion/Javascript help please! (Return/function question)

Ok I'm making (or trying...) to make a script where I have a number of small pictures which you click on to get an enlarged version (without changing the page). So the idea goes - you click the picture which uses the "onclick" command to access a function to change the variable called "selected". But it isn't returning the new value of selected because I'm not using the "return" command properly... or I've made some screw-up in the loop.

- But I'm sticking with the idea that I'm not returning it properly! I'm not very familiar with javascript so if someone could help me with this then that would be great :)

<html>


<head>
<script type="text/javascript">
var selected


function change_a(selected)
{
selected=1
return selected
}

function change_b(selected)
{
selected=2
return selected
}



</script>
</head>




<body>
<image src="image_a.bmp" onclick="change_a(selected)">
<image src="image_b.bmp" onclick="change_b(selected)">


<script type="text/javascript">


if (selected==1)
{alert("Image -a- selected")}

if (selected==2)
{alert("Image -b- selected")}


document.write (selected)


</script>


</body>
</html>


You need to place semicolons at the end of every line in Javascript, like in C :)

(This is because different platforms have different newline things).

eg:
function change_b(selected)
{
selected=2;
return selected;
}

Note that I did not put a semicolon after Function. This because you could start writing out the function on the same line as that curly brace, and that curly brace could easily be on the same line as the actual function.
Same goes with any other of those sorts of things, such as If and Repeat.

you also need to use an img tag and don't use bmps use gif, jpeg, or png.

Well I found this
With traditional programming languages, like C++ and Java, each code statement has to end with a semicolon.

Many programmers continue this habit when writing JavaScript, but in general, semicolons are optional! However, semicolons are required if you want to put more than one statement on a single line.


So I do it like...
function change_a(selected)
{
selected=1;
return selected
}


That? Because that still doesn't work. I think I have more than one problem. Maybe a little more advice?


Perturbatio: Yeah I just noticed I had put "image" instead of "img". But my images are still showing for some reason.

edit- multiline statements work. To make a variable global you place it at the start of the header right? Is it something with the variables other than returning them?

Yeah I just noticed I had put "image" instead of "img". But my images are still showing for some reason.


Forgiving browsers. But it isn't valid HTML.

Commands like this:
document.write (selected)

require a semicolon at the end. Not sure if Javascript is tolerant enough, I don't think so. Make sure to turn on the javascript error msg console. If you don't, errors ill simply stop a script from working and you don't know why.

All commands lines require the semicolon, exceptions are single commands in if, for etc. brackets, eg:

for(i=0; i<100; i!!)
{ alert("I donßt need a semicolon") }

as well as if, function, for, while and so on structures.


Things like
var i=1;
selected=2;
all need it.

well your script is confusing me:

function change_b(selected)
{
selected=2;
return selected;
}


There is no sense in receiving the value of "selected" as a parameter since it has no influence on the return value.

So simply use

function change_b()
{
selected=2;
return selected;
}


But in this case you even donßt need to use functions at all, this should work as well:


<image src="image_a.bmp" onclick="selected=1;">
<image src="image_b.bmp" onclick="selected=2;">


And finally, your alert part won't work since it's not running in a loop, and loops are very uncommon in javascript. (msie even blocks them) Interactivity is rather realized using events and timeouts. Eg:

setTimeout(my_thread(),100);

will execute the function my_thread() after 100 millisecs.

Of course, the last line of the function my_thread() contains this line (setTimeout(my_thread(),100);) again, so the function will be called every 100 millisecs. This way you can have a parallel thread or "loop" that wont stop the browser.

You may do something like this:
var selected=0;
var old_selected=0;
setTimeout(my_thread(),1000);

function my_thread()
  {
  setTimeout(my_thread(),1000);
  if(selected != old_selected) 
  {
     alert('Value of selected is' + selected);
     old_selected=selected;
  }
}



Then again, I'm not sure if the alerts will block things if you dont click them away quickly.

Then there's a further thing that I am not sure: can you use onClick with images? Thought this works only with links? Images support OnMouseOver etc. not sure if OnClick is supported by all major browsers. Well you easily could add an <a> tag around them.

BTW: semicolons may be optional, but since Javascript is structured like many OOP languages it may be a good idea not to learn unconventional habbits. BTW sorry for my typos (like i!! instead of i++), got some keyboard troubles on this new tiny linux system.

Yes my code confuses lots of people :) I'm going to look at javascript later if I have time... I often don't know what I'm doing with languages I find confusing then next time I look at it I realize what I did wrong.

Thanks to everyone who tried to explain it to me =) I think I need a break.