iOS Webapp - Menü-Links öffnen im Safari (Gerät iPhone 4S)

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von Piro299, 23.12.13.

  1. Piro299

    Piro299 Braeburn

    Dabei seit:
    03.02.10
    Beiträge:
    47
    Moin zusammen,

    ich bin seit Wochen im Netz unterwegs, um mein Problem zu lösen.

    Ich habe ein iOS Webapp mit jQuery Mobile geschrieben.

    Meine App "HomeControl" zeigt mir den Verlauf von Temperatur und Luftfeuchtigkeit meiner Zimmer mit Hilfe von der Javascript Bibliothek Highstock.

    Mein Problem ist, dass ich in meiner Navigation auf einen Raum (neue HTML Seite) klicke und die Seite wird leider im Safari geöffnet.

    Komischerweise funktioniert es besten auf dem iPhone 4 meiner Frau. Alles bleibt in der Webapp und wird hier geöffnet.

    Folgende Einstellungen haben meine Links in der Navigation.
    Code:
    <ul>
      <li><a href="room1.html" data-ajax="false"><img src="../img/smico5.png">Schlafzimmer</a></li>
      <li><a href="room2.html" data-ajax="false"><img src="../img/smico5.png">Kinderzimmer</a></li>
    </ul>
    
    benötige ich, damit die Seite neugeladen wird und die Daten der Grafik (Highstock) geladen werden.

    Ich habe mein iPhone 4S mal auf Werkseinstellung gesetzt. Leider ohne Erfolg.

    Warum klappt es bei meiner Frau (iPhone 4) und nicht bei mir (iPhone 4S).

    Als letzte Variante könnte ich eine OnePage mit mehreren div Bereichen je Seite bauen. Aber bevor ich das umschreibe, würde ich gerne verstehen, warum auf einem iPhone 4S nicht funktioniert.

    Danke im Voraus.
    Sven
     
  2. Piro299

    Piro299 Braeburn

    Dabei seit:
    03.02.10
    Beiträge:
    47
    Moin, so eine Lösung habe ich gefunden.

    Code:
    <script>(function(a,b,c){if(c inb&&b[c]){vard,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"ind&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>
    
    Damit verhindert man, dass die Links im Safari geöffnet werden. Ist aber nur eine Workaround für mich. Würde trotzdem wissen wollen, warum das auf einem iPhone 4 geht und auf meinem iPhone 4S nicht.
     
  3. zilVerGFX

    zilVerGFX Macoun

    Dabei seit:
    26.12.08
    Beiträge:
    118
    Moin,

    Links von Webseiten, die als Webapp auf dem Homescreen abgelegt werden, werden von iOS genau so behandelt wie Links in einer normalen App. Sprich: der entsprechende Link wird in Safari geöffnet.
    Es wäre interessant zu wissen, welche iOS Version auf dem iPhone deiner Frau läuft. Ich gehe mal davon aus, dass das Verhalten von Links in älteren iOS Versionen vielleicht anders gehandhabt wurde.

    Dein Workarround macht jedenfalls nichts anderes, als das Standard-Verhalten des click-Events auf Links zu unterbinden (in dem Fall die Seite in Safari zu öffnen), und stattdessen über document.location zu navigieren.

    Code:
    a.preventDefault() // verhindert standart verhalten von links
    
    // das href-attribut deines links wird über document.location geladen
    // eigentlich steht hier: document.location.href = d.href
    a.href=d.href 
    
    
    Eigentlich sollte man in solchen Fälle (aufgrund von Browser-Kompatibilität) immer window.location verwenden. Da deine App aber eh nur auf iOS-Devices laufen soll, ist das hier egal.

    Ich hoffe das bringt dir etwas Klarheit in die Sache :)
     
  4. Piro299

    Piro299 Braeburn

    Dabei seit:
    03.02.10
    Beiträge:
    47
    Danke für die Antwort. Auf beiden iPhones ist das aktuelle iOS drauf. Das mit den Links kann ich nicht ganz glauben, da in einer Webapp aufgrund der META Tags das Verhalten definiert wird und deshalb nicht im Safari geöffnet werden sollte.

    Aber nichts desto trotz, meine Frau hat alles gleich bis auf das iPhone selbst.

    Mmh, sehr merkwürdig alles.
     
  5. zilVerGFX

    zilVerGFX Macoun

    Dabei seit:
    26.12.08
    Beiträge:
    118
    Wie gesagt, der Workarround macht eben nichts anderes als das Standardverhalten zu umgehen. Durch Meta-Tags kannst du das Verhalten von Browser-Events nicht beeinflussen, du kannst lediglich die Darstellung anpassen.
    Schau dazu mal hier:
    https://developer.apple.com/library...eference/SafariHTMLRef/Articles/MetaTags.html

    Mich würde trotzdem brennend interessieren, warum das Problem nur auf deinem iPhone auftritt. Vielleicht kannst du mir den Link zu deiner App mal per PN zuschicken, dann kann ich mir das mal genauer anschauen :)