2009-08-09 14 views
1

Ich bin nicht sehr erfahren mit JavaScript und ich habe Probleme mit Variablen Umfang und jquery. Ich habe folgende Struktur:

function pass_variables() 
{ 
    username = "efcjoe" 
    response = post_variables(username) 
    alert(response) 
} 

function post_variables(username) 
{ 
    $.post(
     '/path/to/url/', 
     { 
      'username': username, 
     }, 
     function(data) 
     { 
      valid = (data != 0) ? true : false 

      // OPTION 1: If I put return here... 
      return valid; // ... the alert box in pass_variables says "undefined" 
     }, 
     "text" 
    ); 

    // OPTION 2: If I put return here... 
    return valid; // ... The alert box does not pop up, and Safari debug gives 
        //  me the error: "Can't find variable: valid" 
} 

Fehle ich da etwas? Ich denke, valid sollte eine globale Variable sein, und daher sollte Option 2 gut funktionieren. Ich bin wirklich nicht sicher über die Option 1.

Kann mir jemand einen Ratschlag geben, wie man das am besten funktioniert?

Vielen Dank.

+0

Eww, weniger globale Variablen wie möglich. In solchen Fällen machst du etwas falsch. – Dykam

Antwort

3

In Ihrem Option 1 Sie von der Callback-Funktion zurückkehren , und sein Rückgabewert wird nie verwendet, da diese Funktion nur aufgerufen wird, wenn die Ajax-Anforderung endet.

In der Option 2, Sie kehren von Ihrer Hauptfunktion, sondern dass die Rückkehr geschieht, bevor die Rückruffunktion einen beliebigen Wert auf Ihre valid Variablen zuweisen.

Ich würde Ihren Code auf diese Weise umgestalten, ohne globale Variablen:

function post_variables(username){ 
    $.post('/path/to/url/',{ 
    'username': username, 
    }, 
    function(data){ 
    var valid = data != 0; 

    // OPTION 3: Work in the callback function 
    alert(username); 
    alert(valid); 

    // OPTION 4: Pass the values and work on another function 
    otherFunction(username, valid); 
    },"text"); 
} 

function otherFunction(username, isValid){ 
    //... 
} 
8

Ajax-Aufrufe sind asynchron, was bedeutet, dass sie aufgerufen werden, aber warten, bis die Ausführung abgeschlossen ist. Grundsätzlich wird Ihre Warnung ausgelöst, bevor die Ajax-Anforderung abgeschlossen wurde, und Sie können die Callback-Funktion ausführen, um Ihre Variable zu ändern.

Das Beste, was Sie tun können, ist eine Funktion übergeben, die ausgeführt wird, wenn die Ajax-Anfrage abgeschlossen ist. Dies negiert auch die Notwendigkeit einer globalen Variablen, die auf da andere Plugins verpönt sind, Skript ihren Zustand ändern können, und Ihr Skript Fehler offen lassen, Mängel usw.

Eg

function foobar(){ 

    //call function to do post request and also pass a function to run 
    //when post has returned 
    runPostRequest(callbackFn); 

} 

function runPostRequest(callback){ 

    $.post('/foo', callback); 

} 

function callbackFn(data){ 

    console.log('post request complete'); 

} 
3

Ja, Ihr Problem ist, dass Sie Ich verstehe hier nicht einige Probleme mit der Reihenfolge der Vorgänge. Die Funktion, die Sie an $.post übergeben, ist ein Rückruf; Es läuft später, erheblich nach post_variables() endet. post_variables() selbst wartet nicht auf die $.post zu beenden, so valid existiert nicht, wenn Sie versuchen, es zu verwenden.

2

Denken Sie daran, dass AJAX asynchron ist. Die return valid; wird ausgeführt sofort nachdem die $.post() eingerichtet ist, aber bevor die Post abgeschlossen ist (und daher vor valid definiert ist). Was Sie wahrscheinlich tun möchte, ist dies:

function post_variables(username) 
{ 
    var username = "efcjoe"; 

    $.post(
     '/path/to/url/', 
     { 
      'username': username, 
     }, 
     function(data) 
     { 
      var valid = (data != 0) ? true : false 
      alert(valid); 
     }, 
     "text" 
    ); 
} 

Und beachten Sie, dass dies nicht mehr globale Variablen benötigt, aber funktions Umfang Variablen, die deklariert werden mit var.

1

Sie das Problem lösen könnte ganz leicht durch eine Funktion anstelle eines Inline ein, und der Event-Funktion zuweisen funktioniert der Alarm:

function pass_variables() 
{ 
    username = "efcjoe" 
    response = post_variables(username); 
} 

function post_variables(username) 
{ 
    $.post(
     '/path/to/url/', 
     { 
      'username': username, 
     }, 
     receivedData, 
     "text" 
    ); 
} 

function receivedData(data) 
{ 
    valid = (data != 0) ? true : false; 
    alert(valid) 
}