Calling javascript function from a select onChange

Question

So I have a simple HTML select box, and a javascript alert function. I want the select box to have an onchange event that will call the javascript alert function. This is what I have so far:

HTML

<div style="float: left">Type: <select id="selector" onChange="jsfunction()">
  <option value="Pyr">Pyramidally</option>
  <option value="Lin">In-Lines</option>
  <option value="Sym">Symmetrically</option>
  <option value="Nsym">Non-Symmetrically</option>
</select>
</div>

Javascript

function jsfunction(){
    alert("hi");
}

It doesn't work and for the life of me I can't figure out why. Most other questions of this nature I've found suggest "" around calling the function - which I've got or making the onChange 'c' capital, which I also have. Any possible help? I'd be very grateful.

it works perfectly on me. [JSFIDDLE](http://jsfiddle.net/Y7a6V/) example — Yaje, Jul 15 '14 at 05:56
I'm using google chrome. I've tried it in IE but it also doesn't work — Genome314, Jul 15 '14 at 05:57
I have, and it works - but I have the exact same code open in another tab and it straight out doesn't work. Bizzare x_X Thankyou?? I don't know whats up — Genome314, Jul 15 '14 at 05:59
@Genome314 If you're also using JSFiddle, note that one of the default options is "`onLoad`" compared to the "`No wrap`" Yaje's fiddle uses. This selection will affect the scope of the code you input. [Simple example doesn't work on JSFiddle](http://stackoverflow.com/questions/5431351/simple-example-doesnt-work-on-jsfiddle) — Jonathan Lonowski, Jul 15 '14 at 06:00
@Genome314 can you post where this `jsFunction()` is located in your markup/external file? — Yaje, Jul 15 '14 at 06:02
@JonathanLonowski That seems to be what the problem was, thank you. Also, thanks Yaje — Genome314, Jul 15 '14 at 06:03

score 12 · Answer 1 · edited Dec 18 '15 at 10:28

12

<!DOCTYPE html>
<html>
    <head>
        <script>
            function jsfunction(){
                alert("hi");
            }
        </script>
    </head>
    <body>
        <select id="selector" onchange="jsfunction()">
            <option value="Pyr">Pyramidally</option>
            <option value="Lin">In-Lines</option>
            <option value="Sym">Symmetrically</option>
            <option value="Nsym">Non-Symmetrically</option>
        </select>
    </body>
</html>

It works. You made a mistake in onchange.

edited Dec 18 '15 at 10:28

Elias Mårtenson

3,820
23
32

answered Jul 15 '14 at 06:00

user3218194

448
4
15

2

nope. `onchange` is not case-sensitive in html markup – Yaje Jul 15 '14 at 06:00

Calling javascript function from a select onChange

1 Answers1

Linked