selected form - how to change variables value, when value of form is selected

Question

I want (number) to have different values when different option is selected. For example, number=1 when 1 is selected, number=2 when 2 is selected, how would I do that with JavaScript?

  <form>
        Select your favorite letter!
        <select id="numbers">
            <option selected disabled>Choose one</option>
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
        </select>
    </form>
    <script>
        var number;
    </script>

Answer 1

Try this:

<form>
    Select your favorite letter!
    <select id="numbers">
        <option selected disabled>Choose one</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
</form>
<script>
    var number = document.getElementById("numbers").value;
</script>

Answer 2

The script you would need for that would look something like this:

var select = document.getElementById('numbers')
var number;

select.addEventListener('change', function(){
    number = select.value
    alert(number)
})

This would work in most modern browsers you may need a polyfill if you need support for older browsers.

See fiddle here: https://jsfiddle.net/rainb0w/LzL3ybfm/

Answer 3

This is a quick and easy way to do it:

<form>
    Select your favorite letter!
    <select id="numbers">
        <option selected disabled value="">Choose one</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
</form>
<script>
    var number = document.getElementById("numbers").value;
    document.getElementById("numbers").onchange = function()
    {
        var number = document.getElementById("numbers").value;
    };
</script>

Notice that I have added value="" so that you can detect the variable as empty if the user didn't select anything, otherwise number would contain the Choose one string.