脚本文件未在Android Webview自定义渲染器中加载

时间:2017-05-30 05:09:40

标签: javascript android html android-webview

我使用Android WebView渲染器加载了本地html。 html正确加载。但是没有加载在html文件中引用的脚本。脚本文件位于assets文件夹中。

呈现文件代码

protected override void OnElementChanged(ElementChangedEventArgs<HybridWebView> e)
            {
                base.OnElementChanged(e);

                if (Control == null)
                {
                    var webView = new Android.Webkit.WebView(Forms.Context);
                    webView.Settings.JavaScriptEnabled = true;
                    if (Build.VERSION.SdkInt >= Build.VERSION_CODES.JellyBean)
                    {
                        webView.Settings.AllowUniversalAccessFromFileURLs = true;
                        webView.Settings.AllowFileAccessFromFileURLs = true;
                    }
                    SetNativeControl(webView);
                }

                if (e.NewElement != null)
                {

                    Control.LoadUrl("file:///android_asset/Sample/index.html"); 
                }
            }

Html代码

&#13;
&#13;
<!DOCTYPE html>
<html class="no-js">
    <head> 
		<script src="file:///android_asset/jquery-1.10.2.min.js"></script>
			<!-- Render -->
			<script src="file:///android_asset/epub.min.js"></script> 
		<script type="text/javascript">     
		var book = ePub("file:///android_asset/Sample/Azure_Cosmos_DB_and_DocumentDB_Succinctly/);
		  $(document).ready(function () { 	 
			book.renderTo("area");
		});       
    </script>
    </head>
    <body>
 <div id="main">
    <div id="prev" onclick="book.prevPage()" style="font-size: 64px;cursor:pointer;" class="arrow">‹</div>
    <div id="area" ></div>
    <div id="next" onclick="book.nextPage()" style="font-size: 64px;cursor:pointer;" class="arrow">›</div>    
</div>    
    </body>
</html>
&#13;
&#13;
&#13;

有人建议我在webview渲染方法中加载相应的JS文件吗?

1 个答案:

答案 0 :(得分:1)

通常,您会将脚本标记放在HTML的底部而不是顶部。

<!DOCTYPE html>
<html class="no-js">
    <head> 
    </head>
    <body>
 <div id="main">
    <div id="prev" onclick="book.prevPage()" style="font-size: 64px;cursor:pointer;" class="arrow">‹</div>
    <div id="area" ></div>
    <div id="next" onclick="book.nextPage()" style="font-size: 64px;cursor:pointer;" class="arrow">›</div>    
</div>    
    </body>
<script src="file:///android_asset/jquery-1.10.2.min.js"></script>
<!-- Render -->
<script src="file:///android_asset/epub.min.js"></script>
<script type="text/javascript">
    var book = ePub("file:///android_asset/Sample/Azure_Cosmos_DB_and_DocumentDB_Succinctly/");
    $(document).ready(function () {
        book.renderTo("area");
    });
</script>
</html>

您还忘记了“var book = ePub("file:///android_asset/Sample/Azure_Cosmos_DB_and_DocumentDB_Succinctly/");

末尾的”