Question

我正在使用Apache Cordova制作Android应用程序。一切都适用于默认情况下使用Chrome的Android 6.0，问题出在使用默认Android浏览器的Android 4.2.2（三星Galaxy S4 mini）上。

如果我没有弄错的话，应用程序就会启动＆＃34;在使用cordova编译并安装在Android操作系统上之后的默认Android浏览器中。

在默认的Android浏览器中，页面在加载时为空。但在Chrome中一切正常。

问题出在默认的Android 4.2.2浏览器中。它不适用于诺基亚1520（使用Windows Phone操作系统）的默认浏览器。

的index.html：

$('#content').html("<span>test1</span>");

function showLogin() {
    $('#content').html(`<span>
                        test2
                        </span>`);
}

1.js：

showLogin()

2.js（此文件中的任何内容均无效，我无法在页面上看到test1或test2）：

setTimeout()

我做了什么＃1

我还尝试拨打setTimeout(function() { showLogin(); }, 1000);内的$(document).ready(function() { $('#content').html("<span>test3</span>"); // Works fine. showLogin(); });：

$(document).ready(function() {
 $('#content').html("<span>test1</span>");

    function showLogin() {
        $('#content').html(`<span>
                    test2
                    </span>`);
    }
});

我做了什么＃2

1.js：

{{1}}

2.js（此文件中没有任何内容可用）：

{{1}}

Answer 1

Android 4.2.2股票浏览器出现问题。并且调试输出不起作用。你想在这个问题上坚持多久？

这是绕过它的一种方法：将文件写入多个文件并合并它们，然后将它们推送到.apk，这样您最终只能得到1个文件。缺点是您可能更难以使用合并文件进行调试。但是，正如你所说，使用Android 6.0它可以工作，所以用它来调试。一些Google-fu显示了以下选项：Grunt和Gulp.js

其他选项是查看是否使用requirejs有效。有关详细信息，请参阅此post。

Answer 2

问题是由多行JavaScript字符串“`”的引号引起的。

我改变了这个：

function showLogin() {
    $('#content').html(`<span>
                        test2
                        </span>`);
}

对此：

function showLogin() {
    $('#content').html("<span>test2</span>");
}

一切正常。

在Android浏览器中看起来不支持这些引号。我想这会在2.js文件中触发一个异常，这就是2.js中其他代码没有执行的原因。

我最终使用反斜杠作为多行字符串，如下所示：

function showLogin() {
        $('#content').html("<span>\
                            test2\
                            </span>");
}

反斜杠也适用于单引号，如下所示：

function showLogin() {
        $('#content').html('<span>\
                            test2\
                            </span>');
}

Answer 3

试试这个，你可以在1.JS的设备上或你的事件触发的电话上动态加载脚本：

{{1}}

Answer 4

问题出在2.js文件

$('#content').html("<span>test1</span>");

function showLogin() {
    $('#content').html("<span>test2</span>");
});

在最后一行你使用了小支架来制动功能，所以它是未定义的。在花括号后移除小支架。工作示例See here

Answer 5

尝试在</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 应包括

function showLogin() {
 $('#content').html("<span>test2</span>");
}
$(document).ready(function() {
 $('#content').html("<span>test1</span>");
});

1.js 应该包括

$(document).ready(function() {
    $('#content').html("<span>test3</span>"); // Works fine.
    showLogin();
});

另一种方法

<强> 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 应包括

function showLogin() {
 $('#content').html("<span>test2</span>");
}
function showTest1() {
 $('#content').html("<span>test1</span>");
}

1.js应该包括

function showTest3() {
    $('#content').html("<span>test3</span>"); // Works fine.
    showLogin();
}

Answer 6

也许我错了，但我认为＆＃34; $（＆＃39; #content＆＃39;）。html（＆＃34; test1＆＃34;）;＆＃34;它的激动2.js和showLogin从未被称为。

我会尝试这样的事情：

$(document).ready(function() {
    $('#content').html("<span>test1</span>");
});
function showLogin() {
    $('#content').html("<span>test2</span>");
}

或者至少单独使用showlogin函数来尝试它。

希望有所帮助

无法从第二个包含的js文件中的第一个包含的javascript文件调用函数

6 个答案: