加载本地文件时android webview不执行javascripts答案

【问题标题】：android webview not executing javascripts when loading local file加载本地文件时android webview不执行javascripts
【发布时间】：2012-03-26 14:29:24
【问题描述】：

我想将本地 jqmobile html 文件加载到 webview 中。我可以使用所有浏览器（包括 Android）打开它，但不能使用 webview。它不会产生任何错误，但是不会出现内容（google map v3）并且不会触发javascript！请帮忙:(

<uses-library android:name="com.google.android.maps" /> 在我的清单以及所有权限上。

webview 活动，

    browse = (WebView) findViewById(R.id.webview1);
    browse.getSettings().setJavaScriptEnabled(true);
    browse.getSettings().setUseWideViewPort(true);
    browse.getSettings().setLoadWithOverviewMode(true);

    browse.setWebChromeClient(new WebChromeClient());

    browse.setWebViewClient(new WebViewClient());

    browse.loadUrl("file:///data/data/" + PACKAGE_NAME + view1 + ".html");

jqmobile html 文件，

<!DOCTYPE wml>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"> 

<title>HTML5 Geolocation</title>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>

<script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=true">

<style type="text/css"> 

  html { height: 100%; width:100%;}
  body { height: 100%;; margin: 0px; padding: 0px; }
  #mapDiv { height: 100%; width:100% }
</style>

</head>
<body >
<div data-role="page" style="height: 100%; width:100%;">
<div data-role="header">
        <h1>Localización</h1>
</div>
<div data-role="content" id="mapDiv">   
 <script language="javascript" type="text/javascript">

var xmlDoc=null;
var xmlHttp=null;
var locations=new Array();
var infowindow = new google.maps.InfoWindow(); 
var marker, i; 
alert("llegint location...");
ConectarLectura();
        if (xmlDoc!=null){
            var x=xmlDoc.getElementsByTagName("location");
                for(i=0;i<x.length;i++){
                var punto= new Array();
                var item = xmlDoc.getElementsByTagName('location')[i];  
                var txt = item.getElementsByTagName('nombre')[0]; 
                punto[0]=txt.firstChild.data;   
                var txt = item.getElementsByTagName('cuerpohtml')[0]; 
                punto[1]=txt.firstChild.data;   
                var txt = item.getElementsByTagName('latitud')[0]; 
                punto[2]=txt.firstChild.data;   
                var txt = item.getElementsByTagName('longitud')[0]; 
                punto[3]=txt.firstChild.data;   
                var txt = item.getElementsByTagName('icono')[0]; 
                punto[4]=txt.firstChild.data;
                punto[4]=punto[4].slice(59,punto[4].length);
punto[4]="../../"+punto[4]; 
                locations[i]=punto;
                }
        }

function ConectarLectura(){

    var docdatos=self.location.href.match( /\/([^/]+)$/ )[1];
    docdatos=docdatos.substring(0,docdatos.lastIndexOf("."));
    docdatos=docdatos+".xml";

    alert(docdatos);

    xmlDoc=null;
    var d= new Date();
    var locXML=docdatos+"?"+d.toString();
        if (window.ActiveXObject){//Internet Explorer
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            xmlHttp.open("GET",locXML,false);
            xmlHttp.send();
            xmlDoc = xmlHttp.responseXML;
        }
        else if (document.implementation.createDocument){ //Otros navegadores

            xmlHttp = new XMLHttpRequest();
            xmlHttp.open("GET",locXML,false);
            xmlHttp.send(null);
            xmlDoc = xmlHttp.responseXML;
        }
        else{ //Navegadores no compatibles
            alert('Browser cannot handle this script');
        }
}

    if(navigator.geolocation) {

        function hasPosition(position) {
            var point = new google.maps.LatLng(position.coords.latitude, position.coords.longitude),

            myOptions = {
                zoom: 20,
                center: point,
                navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},

                mapTypeId: google.maps.MapTypeId.ROADMAP
            },

            mapDiv = document.getElementById("mapDiv"),
            map = new google.maps.Map(mapDiv, myOptions),

            marker = new google.maps.Marker({
                position: point,
                map: map,
                title: "Se encuentra aqui",

            });
            for (i = 0; i < locations.length; i++)
             {   
                marker = new google.maps.Marker({ 
                position: new google.maps.LatLng(locations[i][2], locations[i][3]), 
                map: map,
                icon : locations[i][4]
             });
              google.maps.event.addListener(marker, 'click', (function(marker, i) { 
              return function() { 
                  infowindow.setContent(locations[i][1]); 
                  infowindow.open(map, marker); 

              } 
                  })(marker, i));  

              }
              //Función para añadir nuevos markers
google.maps.event.addListener(map, 'click', function(event) {

    parent.parent.anadePunto(event.latLng);
  });

        }
        navigator.geolocation.getCurrentPosition(hasPosition);
    }

</script>


</div>

</div>
</body>
</html>

【问题讨论】：

<uses-library> 与加载基于 Web 的 Google 地图无关。
检查这个答案：stackoverflow.com/questions/8373182/…
好的，但仍然没有加载谷歌地图 v3 并执行 javascripts...
Anthony，不是解决办法，已经试过了。

标签： java jquery android google-maps jquery-mobile

【解决方案1】：

您是否使用本地存储？否则：settings.setDomStorageEnabled(true);

【讨论】：

尝试创建一个真正的基本页面，例如：
Hello
尝试加载这个，可以吗？
嗯，确保所有元素都没有宽度/高度 == 0...所以也许：“body { height: 100%;;”删除第二个';'。并给 mapDiv 一个宽度/高度。在此之后，您可以尝试调试您的 javascript 并查看它是否是 javascript 错误。这可以通过覆盖 WebChromeClient 的 onJsAlert 并记录 JavaScript 警报来实现...
好吧，调试 onJsAlert 让我找到解决方案！我覆盖了 webChromeClient 的一些地理位置属性并正常工作。非常感谢您的帮助，谢谢！

Hello