Variablenzugriff über jQuery-Ajax

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Variablenzugriff über jQuery-Ajax

    Hallo Leute!

    Ich habe 3 Dateien.

    1. Datei: index.html (jQuery -> $.ajax)
    2. Datei: landscape.php -> $aktuellesBild
    3. Datei: portrait.php -> $aktuellesBild

    Nun ist es so: In Landscape- oder Portrait-Modus kann ich über die Bilder swipen. Wenn ich z.B. in Landscape-Modus beim 3.Bild bin und dann das iPad drehe (orientationchange), dann soll das 3.Bild auch in Portrait-Modus angezeigt werden und nicht wie zur Zeit immer das 1.Bild.

    Nun denke ich, dass man es lösen kann, in dem man über die index.html die Variableninhalte übertragen kann, damit man den aktuellen Index-Wert in die Variable "$aktuellesBild" beim Drehen des iPads setzen kann.

    Kurz gesagt: Beim Drehen von iPad den Variableninhalt von $aktuellesBild von landscape.php über index.html nach portrait.php übertragen und umgekehrt, aber wie?

    Surfer

  • Hi, ich würde mir wohl alle Bilder die du je nach Ausrichtung anzeigen kannst, bereits am Anfang laden.
    Und dann mit reinem JavaScript entscheiden was du anzuzeigen ist.

    Falls du es doch über AJAX realisieren magst, brauchst du einfach nur dataType: 'json' anzugeben (oder Alternativ den Shortcut $.getJSON nutzen)
    api.jquery.com/jQuery.getJSON/

    Der gibt dir automatisch das Objekt zurück, das du in php mit echo json_encode($objekt) ausgibst.

    LG

  • Hi Torben!

    Vielen Dank für deine Antwort!

    Ich habe hier ein Script, der soweit funktioniert (index.html):

    Quellcode

    1. $(document).ready(function() {
    3. $(window).bind('orientationchange', function(e){
    5. function loadData(data) {
    6. $("body").html(data);
    7. }
    9. if (window.orientation == 90 || window.orientation == -90) {
    11. $.ajax(
    12. {
    13. type: "GET",
    14. async: true,
    15. cache: false,
    16. dataType: 'json',
    17. url: "test/orientation/landscape.php",
    18. beforeSend:function(){
    19. $('body').html('<div class="loading"><img src="images/loading.gif" alt="Loading..." /></div>');
    20. },
    21. success: function(data) {
    22. loadData(data);
    23. }
    24. });
    26. } else if (window.orientation == 0 || window.orientation == 180) {
    28. $.ajax(
    29. {
    30. type: "GET",
    31. async: true,
    32. cache: false,
    33. dataType: 'json',
    34. url: "test/orientation/portrait.php",
    35. beforeSend:function(){
    36. $('body').html('<div class="loading"><img src="images/loading.gif" alt="Loading..." /></div>');
    37. },
    38. success: function(data) {
    39. loadData(data);
    40. }
    41. });
    42. }
    43. });
    44. $(window).trigger('orientationchange', true);
    45. });
    Alles anzeigen


    Was fehlt noch, damit beim Drehen von iPad der Variableninhalt von $aktuellesBild von landscape.php über index.html nach portrait.php übertragen und umgekehrt?

    Surfer

  • Hi Torben!

    Vielen Dank für deine Antwort!

    D.h. so müsste die index.html aussehen?

    Quellcode

    1. $(document).ready(function() {
    3. $(window).bind('orientationchange', function(e){
    5. function loadData(data) {
    6. $("body").html(data);
    7. last_data = data;
    8. }
    10. if (window.orientation == 90 || window.orientation == -90) {
    11. var url= "test/orientation/landscape.php";
    13. if (last_data) {
    14. url += '?aktuellesBild=' + last_data.aktuellesBild;
    15. }
    16. $.ajax(
    17. {
    18. type: "GET",
    19. async: true,
    20. cache: false,
    21. dataType: 'json',
    22. url: url,
    23. beforeSend:function(){
    24. $('body').html('<div class="loading"><img src="images/loading.gif" alt="Loading..." /></div>');
    25. },
    26. success: function(data) {
    27. loadData(data);
    28. }
    29. });
    31. } else if (window.orientation == 0 || window.orientation == 180) {
    32. var url= "test/orientation/portrait.php";
    34. if (last_data) {
    35. url += '?aktuellesBild=' + last_data.aktuellesBild;
    36. }
    37. $.ajax(
    38. {
    39. type: "GET",
    40. async: true,
    41. cache: false,
    42. dataType: 'json',
    43. url: url,
    44. beforeSend:function(){
    45. $('body').html('<div class="loading"><img src="images/loading.gif" alt="Loading..." /></div>');
    46. },
    47. success: function(data) {
    48. loadData(data);
    49. }
    50. });
    51. }
    52. });
    53. $(window).trigger('orientationchange', true);
    54. });
    Alles anzeigen


    Und landscape.php und portrait.php so?

    Quellcode

    1. HTML/CSS

    ...

    Quellcode

    1. $bild = $_GET['aktuellesBild'];
    2. ...
    3. $pic['aktuellesBild'] = $bild;
    4. echo json_encode($pic);

    ...

    Quellcode

    1. HTML/CSS


    Surfer

  • Hi Torben!

    Es funktioniert leider nicht. Es wird einfach nichts angezeigt. Die Seite bleibt weiß, egal, was man macht.

    Ich würde aber gerne nach diesem Prinzip haben:

    Quellcode

    1. ...
    2. dataid = <?php echo $id; ?>;
    3. datatyp = "<?php echo $type; ?>";
    5. $.ajax(
    6. {
    7. type: "GET",
    8. url: "test/orientation/landscape.php",
    9. data: "type="+datatyp+"&issueid="+dataid,
    10. beforeSend:function(){
    11. $('body').html('<div class="loading"><img src="images/loading.gif" alt="Loading..." /></div>');
    12. },
    13. success: function(data) {
    14. loadData(data);
    15. }
    16. });
    17. ...
    Alles anzeigen

    Weil ich sowas bereits einsetze und brauche, damit die entsprechende (Zeitungs-)Ausgabe erscheint, die ich "durchblättern" kann. Und das, s. "data", funktioniert soweit. Ich kann auf die Variablen in der landscape.php per GET zugreifen. Kann man denn nicht sowas in der Art machen bzw. das Ganze erweitern (s. data), dass man beim Drehen von iPad den Variableninhalt von $aktuellesBild von landscape.php über index.php nach portrait.php übertragen und umgekehrt? Oder geht es nur mit JSON?

    Surfer

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Surfer ()

  • Generell nein. Auf php variablen hast du ja mit javascript keinen Zugriff. Deswegen musst du sie mit json irgendwie in javascript übernehmen.
    Du kannst die Seite ja mal irgendwo hochladen, wenn du nicht weiter kommst, dann probiere ich es mit Firebug aus.

    Unsaubere Lösung: du kannst die aktuelle Seite einfach ein einer session speichern, dann kannst du serverseitig zwischen den php dateien kommunizieren.