将外部Javascript文件注入到HTML页面并在WP8 Webbrowser上执行方法

Question

我在WP8应用程序中的Webbrowser控件上执行Javascript方法方面遇到了困难。我使用的XAML是：

<phone:WebBrowser IsScriptEnabled="True"  x:Name="mainBrowserControl"  Grid.Row="2"/>            

当按钮点击事件发生时，我将外部 JavaScript 文件 testjs.js 添加到当前加载的 HTML 页面的头部（该文件是应用程序包的一部分，位于 xap 文件内）。

        string root = Package.Current.InstalledLocation.Path;           
        string jsfile_path = string.Format("{0}/testjs.js", root);

        var script = string.Format(@"var script=document.createElement('script');
                                     script.src=""{0}"";
                                     document.getElementsByTagName('head')[0].appendChild(script);", jsfile_path);
        mainBrowserControl.InvokeScript("eval", script);

接着，在另一个按钮点击事件中，我尝试执行testjs.js文件中的一个JavaScript方法，如下：

mainBrowserControl.InvokeScript("eval", "callMe();");

但是它返回了错误信息：

发生了类型为'System.SystemException'的异常，位于Microsoft.Phone.Interop.ni.dll中，但未在用户代码中处理

附加信息：发生了未知错误。错误代码：80020101。

testjs.js文件中仅包含3个简单的函数。我的最终目标是与外部javascript文件（如testjs.js）交互（发送和接收值到和从javascript函数），并将其应用于我的应用程序。

 function callMe() {   
alert("hello called");
}
function showSum(val1, val2) {
alert(val1 + val2);
}
function addTwo(val1,val2) {
return val1+val2;
}

我该如何在我的Windows Phone应用程序中调用testjs.js中的这些方法？

- Sebastian

---

可能是如何在WebBrowser控件中注入Javascript？的重复问题。 - Jonathan Naguin

在我的情况下，它涉及到注入外部Javascript文件并调用外部JS文件中的方法。建议的示例或相关问题显示将脚本内联添加到文档中。对于Microsoft.Phone.Webbrowser，没有浏览器.Document方法。 - Sebastian

检查第三个答案... - Jonathan Naguin

那个答案是针对Windows WebBrowser的，而不是Windows Phone WebBrowser的，我再次努力实现它。 - Sebastian

可能是如何在WP7 WebBrowser控件中注入Javascript？的重复问题。 - noseratio - open to work

Answer 1

更新: 请查看下面Noseratio的评论和链接，仅当你将InvokeScript调用的页面中已经有一个<script>标签在head中时才有效。这个标签可以是空的，但必须存在。

在Windows Phone版本的WebBrowser中，任何尝试调用JavaScript的操作都必须在页面加载完成后进行。如果在页面处于其他状态时尝试调用JS，则会出现您收到的错误。

在您的XAML中，添加一个“LoadCompleted”事件处理程序，如下所示：

<phone:WebBrowser IsScriptEnabled="True" LoadCompleted="DoneLoaded"  x:Name="mainBrowserControl"  Grid.Row="2"/>

将第二个按钮设置为“禁用”（Visibility.Collapsed），以便用户无法单击它。然后，在页面的代码后台实现处理程序。

    private void DoneLoaded(object sender, NavigationEventArgs e)
    {
        Debug.WriteLine("Loading Complete: "+e.Uri);
        if (e.Uri.ToString().Equals("/the_url_of_the_page_with_embedded_js.html"))
            // Enable the button that will invoke the JS
            // Or, simply perform the InvokeScript here
        }
    }

在这个时候，您可以导航/导航到包含JS的页面。当它加载完成时，上面的事件将触发并启用您的“执行”按钮。随着页面加载完成，Invoke就不应该再出错了。当然，这是假设JavaScript中没有错误的情况下。希望这能帮到您！

- MojoTosh

---

当页面没有任何<script>标签时，这是否适用于WP8？您仍然可以执行类似于webBrowser.InvokeScript("eval", new string[] { "document.body.style.backgroundColor = 'yellow'" })的操作吗？ - noseratio - open to work

它看起来需要在头部放置一个 <script> 标签，即使是空的也可以工作。我做了一些快速测试，完全没有任何 <script> 标签，它似乎每次都会崩溃。 - MojoTosh