0

我正在用地图进行地理测验。我有这个功能可以随机加载不同的国家名称。

<h1>Can you locate

<script type="text/javascript">

generateCountry();


function generateCountry(){

filenames = [ "Greece", "France", "Italy", "United Kingdom", "Germany" ];

filename = filenames[Math.floor(Math.random()*filenames.length)];

document.write(filename);
}


</script>
on the map?
</h1>

我正在使用谷歌地图,当我点击具有功能的正确国家时,我会收到关于我是对还是错的警报。

   function getCountry(latLng) {
              geocoder.geocode( {'latLng': latLng},
                function(results, status) {
                  if(status == google.maps.GeocoderStatus.OK) {
                    if(results[0]) {
                      for(var i = 0; i < results[0].address_components.length; i++) {
                        if(results[0].address_components[i].types[0] == "country") {
                          if(results[0].address_components[i].long_name == filename) {
                              alert("right");

                                generateCountry();

                           } else {
                              alert("wrong");

                           }
                        }
                      }
                    }


                    else {
                      alert("No results");
                    }
                  }
                  else {
                    alert("Status: " + status);
                  }
                }
              );
      }  

当测验加载时,我看到第一个问题,例如:你能在地图上找到法国吗?并且地图反应良好。当我点击右边的那个时,之后的地图似乎在文件名变量中识别出一个新的国家,因为当我点击其他国家时,我终于在德国获得了一个权利。所以地图似乎是正确的。问题是上述问题中的名称并没有从法国更改为德国。我需要做什么才能在第一个问题的右侧警报上单击“确定”后加载一个新的国家/地区名称,而无需重新加载整个页面?我知道我可能没有使用最好的方法来做到这一点,所以任何帮助和指导将不胜感激。

4

1 回答 1

0

不要使用 document.write。相反,在文本中放置一个空跨度并给它一个 id,如下所示:

<h1>Can you locate <span id="country"></span> on the map?</h1>

然后,当您想要更改它时,使用 DOM 获取元素并更改文本:

document.getElementById('country').textContent = "Germany";

这样做的另一个好处是脚本不必位于 ; 的中间h1。您可以将其移动到head或 的末尾body,具体取决于您的喜好。

于 2013-01-25T20:45:31.173 回答