外部脚本在 Windows Phone App 8.1 中不起作用答案

【问题标题】：External scripts not working in Windows Phone App 8.1外部脚本在 Windows Phone App 8.1 中不起作用
【发布时间】：2015-03-11 12:31:36
【问题描述】：

我在我的项目中添加了一个 WebView。如果我导航到包含外部 javascript 文件的 html 文件，它们将不起作用。如果我将 javascript 代码硬编码到 html 文件中，它可以正常工作。

这里是html部分：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript" src="testjs.js"></script>
</head>
<body>
    <div id="abcd"></div>
    <br/>
    hello! this is a simple html block. 
</body>
</html>

这里是javascript部分：

document.getElementById("abcd").innerHTML = "New text!";

当我打开 webview 时，它会显示

hello! this is a simple html block.,

但如果 javascript 代码有效，它会显示

New Test! hello! this is a simple html block.

这是文件夹结构：

【问题讨论】：

你的代码对我来说很好sample
请贴出testjs.js文件的完整代码
我的 testjs.js 文件就是这么短。但它在 WebView 中不起作用。我想我的相对路径有问题。根据我的文件夹结构，html文件中js脚本的相对路径应该是什么？
相对路径应该是“./testjs.js”
您的意思是写src="./testjs.js"？我试过了。即使我尝试使用 src="/testjs.js" ， src="problem_page/testjs.js" 他们都没有工作！ ://

标签： javascript c# windows-phone-8 webview

【解决方案1】：

src="testjs.js" 是正确的。该问题与路径无关。

[更新 1]

您的代码应该像我们通常在 Web 开发中那样工作。但似乎我们需要确保脚本中使用的 html 元素已经初始化，所以我们必须将放在 body 元素的末尾。请尝试以下 html 代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    
</head>
<body>
    <div id="abcd">a</div>
    <br />
    hello! this is a simple html block.

    <script type="text/javascript" src="testjs.js"></script>
</body>
</html>

[更新 2]

同时检查您是否已将testjs.js 的构建操作 更改为内容。转到 Solution Explorer -> 右键单击 testjs.js -> Properties -> 将 Build Action 更改为 Content。 这将确保 .js 文件将作为您应用程序的一部分进行部署。

【讨论】：

我认为将 javascript 注入 webview 不是一个好主意，因为它的大小相当大。我想我们可以包含外部 javascript 文件。在这个示例应用程序中，他们使用了外部 JavaScript：code.msdn.microsoft.com/windowsapps/…
我认为你是对的。我得到了代码工作。为避免误导他人，我更改了帖子。
看来你创建的项目是为windows phone 的WebView App，对吧？我将我的项目创建为通用 C# 应用程序。实际上 test.html 页面是从 Pages/SelfStudyNS/OnlineTest.xaml.cs 类导航的。我不确定像 webviews 这样的简单 html 应用程序在这种情况下是否有效。这是解决方案资源管理器的结构：postimg.org/image/5e1r1yfxb
我刚刚根据您的结构创建了另一个测试项目。检查1drv.ms/1ARDmJ6。我要说的另一件事是您是否已将 testjs.js 的构建操作修改为内容？转到解决方案资源管理器-> 右键单击 testjs.js->properties-> 将构建操作更改为内容。我也在回复中更新了这一点。
现在它可以在我从 javascript 属性更改构建操作后工作。非常感谢！

【解决方案2】：

WebView msdn 页面建议出于安全原因，您不能链接到本地内容，但以下情况除外：

但是，您仍然可以使用 ms-appx-web 方案链接到应用程序包中的 HTML 内容，并使用 http 和 https URI 方案链接到 Web 内容。

所以您应该能够使用ms-appx-web:///testjs.js url 链接到您的脚本文件。

【讨论】：