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>

私はGoogleマップを使用しています。関数で正しい国をクリックすると、正しいか間違っているかのアラートが表示されます。

   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);
                  }
                }
              );
      }

クイズが読み込まれると、たとえば最初の質問が表示されます。たとえば、フランスを地図上で見つけることができますか? マップの反応も良い。正しい国をクリックすると、その後のマップはファイル名変数の新しい国を認識しているように見えます。たとえば、他の国をクリックすると、最終的にドイツの権利が得られます。そのため、マップは適切に取得されているようです。問題は、上記の質問の名前がフランスからドイツまで変わらないことです。最初の質問の右側のアラートで [OK] をクリックした後、もちろんページ全体を再読み込みせずに新しい国名が読み込まれるようにするにはどうすればよいですか? 私はおそらく最善の方法を使用していないことを知っているので、助けとガイダンスをいただければ幸いです。

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このようにすることのもう 1 つの利点は、スクリプトが;の途中にある必要がないことです。好みに応じて、headまたは の最後に移動できます。body

于 2013-01-25T20:45:31.173 に答える