Imansible call le funzioni dal primo file incluso javascript dal secondo file js incluso
Sto facendo un'applicazione Android con Apache Cordova. Tutto funziona in Android 6.0, che utilizza Chrome per impostazione predefinita, il problema è su Android 4.2.2 (Samsung Galaxy S4 mini) che utilizza il browser Android predefinito.
Se non sbaglio, l'applicazione viene "avviata" nel browser Android predefinito dopo che è stato compilato con cordova e installato sul sistema operativo Android.
Nel browser Android predefinito la pagina è vuota al caricamento. Ma in Chrome tutto funziona bene.
Il problema si trova nel browser predefinito di Android 4.2.2. Non funziona nel browser predefinito per Nokia 1520 (che utilizza il sistema operativo Windows Phone).
index.html:
<!DOCTYPE html> <html> <head> <script src="js/jquery-3.1.1.min.js" type="text/javascript"></script> <script src="2.js" type="text/javascript"></script> <script src="1.js" type="text/javascript"></script> </head> <body> <div id="content"> </div> </body> </html>
1.js:
$(document).ready(function() { $('#content').html("<span>test3</span>"); // Works fine (i can see test3 on the page). showLogin(); });
2.js (nulla all'interno di questo file funziona, non riesco a vedere test1 né test2 nella pagina):
$('#content').html("<span>test1</span>"); function showLogin() { $('#content').html(`<span> test2 </span>`); }
COSA TRIEDO # 1
Ho anche cercato di call lo showLogin()
all'interno di setTimeout()
:
setTimeout(function() { showLogin(); }, 1000);
COSA TRIEDI # 2
1.js:
$(document).ready(function() { $('#content').html("<span>test3</span>"); // Works fine. showLogin(); });
2.js (nulla all'interno di questo file funziona):
$(document).ready(function() { $('#content').html("<span>test1</span>"); function showLogin() { $('#content').html(`<span> test2 </span>`); } });
6 Solutions collect form web for “Imansible call le funzioni dal primo file incluso javascript dal secondo file js incluso”
Quindi c'è qualcosa di sbagliato con browser Android 4.2.2. E l'output di debug non funziona. Per quanto tempo vuoi continuare a colpire la testa su questo?
Ecco un modo in giro: scrivere i file in più file e unirli prima di spingerli verso il .apk, per cui fininetworking con solo 1 file. Il problema è che si potrebbe avere un debug di tempo più duro con il file fuso. Ma, come si dice, con Android 6.0 funziona, quindi utilizzalo per eseguire il debug. Un po 'di Google-fu ha mostrato queste opzioni: Grunt e Gulp.js
Un'altra opzione sarebbe quella di vedere se l'utilizzo dei requisiti funziona o no. Vedi questo post per ulteriori informazioni.
Il problema è stato causato dalle citazioni per la string JavaScript multilinea "` ".
Dopo aver cambiato questo:
function showLogin() { $('#content').html(`<span> test2 </span>`); }
A questa:
function showLogin() { $('#content').html("<span>test2</span>"); }
tutto funzionava bene.
Sembra che queste citazioni non siano supportte nel browser Android di riserva. Suppongo che questo innesca un'exception nel file 2.js e che era la ragione per cui l'altro codice in 2.js non è stato eseguito.
Ho finito per usare i backslash per le stringhe multiline come questa:
function showLogin() { $('#content').html("<span>\ test2\ </span>"); }
Il backslash funziona anche all'interno di singole citazioni, come questo:
function showLogin() { $('#content').html('<span>\ test2\ </span>'); }
dare una prova a questo, puoi caricare script in modo dinamico su deviceready di 1.JS o sulla tua chiamata triggersta:
var script = document.createElement('script'); script.src = //path of 2.JS file; script.type = "text/javascript"; script.onload = function () { showLogin();// };
il problema è nel file 2.js
$('#content').html("<span>test1</span>"); function showLogin() { $('#content').html("<span>test2</span>"); });
all'ultima row avete utilizzato una piccola staffa che frena la function in modo che sia indefinito. rimuovere la piccola staffa dopo la staffa ricci. esempio di lavoro Vedi qui
Prova a includere tutti i tuoi script appena prima del </body>
.
HTML
<!DOCTYPE html> <html> <head>...</head> <body> <div id="content"> </div> <script src="js/jquery-3.1.1.min.js" type="text/javascript"></script> <script src="2.js" type="text/javascript"></script> <script src="1.js" type="text/javascript"></script> </body> </html>
2.js dovrebbe includere
function showLogin() { $('#content').html("<span>test2</span>"); } $(document).ready(function() { $('#content').html("<span>test1</span>"); });
1.js dovrebbe includere
$(document).ready(function() { $('#content').html("<span>test3</span>"); // Works fine. showLogin(); });
Un altro approccio
HTML
<!DOCTYPE html> <html> <head>...</head> <body> <div id="content"> </div> <script src="js/jquery-3.1.1.min.js" type="text/javascript"></script> <script src="2.js" type="text/javascript"></script> <script src="1.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { showTest1(); showTest3(); }); </script> </body> </html>
2.js dovrebbe includere
function showLogin() { $('#content').html("<span>test2</span>"); } function showTest1() { $('#content').html("<span>test1</span>"); }
1.js dovrebbe includere
function showTest3() { $('#content').html("<span>test3</span>"); // Works fine. showLogin(); }
Forse mi sono sbagliato, ma penso "$ ('# content'). Html (" test1 ");" il suo braying 2.js e showLogin il suo mai chiamato.
Provo qualcosa di simile:
$(document).ready(function() { $('#content').html("<span>test1</span>"); }); function showLogin() { $('#content').html("<span>test2</span>"); }
o alless mettere da solo la function showlogin per provarlo.
Spero che sia d'aiuto