2017-01-16 2 views
0

Ich habe ein Auswahlmenü, das ich für mehrere Funktionen verwenden möchte, aber anstatt diesen Code um jede Funktion zu wickeln, dachte ich, wie ich eine Variable außerhalb davon nicht mache, damit ich das verwenden kann. Jetzt versuche ich das mit der Rückgabe der Variablen und dem Aufruf dieser Funktion, aber es funktioniert nur die erste und wird nicht ausgelöst, wenn ich eine andere Option auswähle.Funktion zurück onchange funktioniert nicht

Was ist der beste Weg, dies zu erreichen?

<select id="level_select" onchange="LevelName()"> 
        <option select disabled>Select Level</option> 
        <option value="2d" id="high_water_pass_1">Highwater Pass 1</option> 
        <option value="2e" id="high_water_pass_2">Highwater Pass 2</option> 
</select> 

var name = LevelName(); 

function LevelName() { 
    level = $('#level_select').find(":selected").attr("id"); 
    return level; 
} 

console.log(name); 
+1

Was erwarten Sie, wenn Sie die ausgewählte Option ändern? Sie geben einen Wert zurück, aber dieser Rückgabewert wird nicht verwendet. –

Antwort

0

Sie sollten console.log in Ihrer Funktion aufrufen:

function LevelName() { 
    level = $('#level_select').find(":selected").attr("id"); 
    console.log(level); 
    return level; 
} 

Ihre console.log ausgelöst wird, wenn tatsächlich.

0

Hier ist eine funktionierende Geige: https://jsfiddle.net/gdb2xod8/2/.

ändere ich wirklich etwas nicht bis auf die Position des Skripts selbst, klicken Sie auf die JavaScript-Gang, und Sie werden bemerken, ich es in den Kopf gesetzt haben

Sie benötigen Skript zu setzen, bevor Sie Ihren html, der Kopf ist ein guter Standort:

<html> 
<head> 
<script> 
    //script here, or better, reference your script in the src attribute 
    var name = LevelName(); 

    function LevelName() { 
    level = $('#level_select').find(":selected").attr("id"); 
    console.log(level) 
    return level; 
    } 

    console.log(name); 
</script> 
</head> 
<body> 
    <select id="level_select" onchange="LevelName()"> 
    <option selected disabled>Select Level</option> 
    <option value="2d" id="high_water_pass_1">Highwater Pass 1</option> 
    <option value="2e" id="high_water_pass_2">Highwater Pass 2</option> 
</select> 
</body> 
</html> 

Auch änderte ich Ihre "Select" -Attribut auf "ausgewählt". Sollte Ihnen das Verhalten geben, das Sie erwarten.

Verwandte Themen