Untergeordnete Knoten werden nicht auf mobilen Browsern entfernt

Ich mache einen virtuellen Guide mit A-Frame in Kombination mit Angular und benutze den nächsten Code, um alle Hotspots und Navigationspfeile vom Tag zu entfernen.Untergeordnete Knoten werden nicht auf mobilen Browsern entfernt

while (this.hotSpotEntity.hasChildNodes()) { 
    this.hotSpotEntity.removeChild(this.hotSpotEntity.childNodes[0]); 
} 

while (this.navigationEntity.hasChildNodes()) { 
    this.navigationEntity.removeChild(this.navigationEntity.childNodes[0]); 
}

Dieser Code wird alle Elemente aus den a-entity Tags entferne ich als globale Variablen definiert haben. Aber es gibt ein Problem mit diesem Code.

S.S .: Datenbank kann nicht verwendet werden, da A-Frame dies nicht unterstützt.

Siehe diese erste Szene unten. Die Pfeile und Lupen werden durch den Code, den ich geschrieben habe, hinzugefügt und sind Kinder der hotspotEntity und navigationEntity.

screenshot_20170329-142718

Ich habe ich auf einen Pfeil klicken, wird der Code navigiert Sie zu einer neuen Szene. Sie konnten jedoch sehen, dass die Pfeile und Hotspots nicht entfernt werden. Dies sind die rot gestreiften Bilder. Das grüne eingekreiste Bild wird nach der Navigation hinzugefügt.

screenshot_20170329-142735

Wenn Sie auf den grünen Pfeil klicken eingekreist, sind Sie in die nächste Szene zu navigieren. Hier konnte man sehen, dass die Bilder vom ersten Himmel nicht entfernt werden, sondern die Bilder der zweiten Szene entfernt werden.

screenshot_20170329-145030

Der Fehler tritt nur auf mobilen Browsern (Google Chrome für Android, Samsung Internet) und nicht auf Desktop-Browsern (Firefox, Rand).

Könnte jemand, warum dieser Fehler nur auf mobilen Browsern auftritt und wie ich es lösen könnte?

Sie könnten die Tour über diesen Link testen: http://student.howest.be/hein.pauwelyn-vand1/poppr/aframe/ und vollständigen Code auf this GitHub Gist.

Quelle

2017-03-29 H. Pauwelyn

verwenden Sie möglicherweise eine ES2015-Funktionen, die nicht auf dem Handy verfügbar sind? Vergisst du vielleicht eine Polyfill? verwenden Sie nicht babel, um auf ES5 zu transpilieren? –

@RicoKahler Ich benutze die Pfeilnotation '() => {...}'. Ich stelle meinen vollständigen Code online. –

Verwenden Sie Babel, um diese auf ES5 zu übertragen? –

Vielleicht etwas versuchen, ein wenig anders:

while (this.hotSpotEntity.firstChild) { 
    this.hotSpotEntity.removeChild(this.hotSpotEntity.firstChild); 
} 

while (this.navigationEntity.firstChild) { 
    this.navigationEntity.removeChild(this.navigationEntity.firstChild); 
}

firstChild ist eine Nur-Lese-Eigenschaft, die null zurück, wenn es nicht ein. Sie können es in der Bedingung verwenden, weil es truthy ist, wenn es ein Kind gibt, und falsy, wenn es nicht gibt.

Wenn das auf Mobile funktioniert und den Bug behebt, dann weiß ich leider nicht warum. ~~Lassen Sie mich wissen, ob das Ihr Problem nicht löst. Ich lösche die Antwort.~~

Quelle

2017-03-29 13:44:09

Nein, es funktioniert nicht. PS: Lösche diese Antwort nicht, weil andere Leute sehen könnten, dass das nicht funktioniert. –

@ H.Pauwelyn, das ist eine gute Idee. Ich dachte nur darüber nach zu löschen, weil ich das eher als Kommentar sehe, mit dem Potential, das Problem zu lösen. Lol. viel Glück –

Seltsam. Vielleicht versuchen Sie 'this.navigationEntity.innerHTML = '''? Erkennen Sie Kinder, wenn Sie diesen Code ausführen? – ngokevin

Untergeordnete Knoten werden nicht auf mobilen Browsern entfernt

Antwort

Verwandte Themen