Javascript将条目与正确答案(从城市到国家)进行匹配

javascript matching an item to the correct answer(correct city to country)

本文关键字:国家 城市 答案 Javascript      更新时间:2023-09-26

使用javascript制作一个简单的游戏,一旦选择开始按钮,将出现一个国家和三个城市。三个城市中有一个与国家匹配,另外两个是假的。比如,爱尔兰,伦敦,巴黎,都柏林都会出现。玩家必须选择与国家相匹配的城市,一旦他们选择了一个城市,就会出现一个弹出框,告诉他们是赢了还是输了,如果赢了,他们将进入下一轮,下一轮将出现另一个国家。

这是我目前拥有的代码,有位丢失,我只是不知道从这里去哪里?任何帮助都是非常感激的,谢谢

    //all my countries
    var countries = ["england", "france", "germany", "hungary", "ireland",    `"italy"`, "norway", "spain", "wales"]
    //gets the screen height and width for the game
    var scnWid,scnHei;
    if (self.innerHeight) // works for all except Internet Explorer
    {
    scnWid = self.innerWidth;
    scnHei = self.innerHeight;
    }
    else if (document.documentElement &&    document.documentElement.clientHeight)
    // internet explorer 6 fix 
    {
    scnWid = document.documentElement.clientWidth;
    scnHei = document.documentElement.clientHeight;
    }
    else if (document.body) // Other versions of ie
    {
    scnWid = document.body.clientWidth;
    scnHei = document.body.clientHeight;
    } 

    //shuffles the country array
    function shuffleArray(arr) {
        var currentIndex = arr.length, temporaryValue, randomIndex ;
    //array hasnt stopped
    while (0 !== currentIndex)

    //find a random element
    randomIndex =Math.floor(Math.random() * currentIndex);
    //swap it with current element
    temporaryValue = arr[currentIndex];
    arr[currentIndex] = arr[randomIndex];
    arr[randomIndex] = temporaryValue;
    //returns the shuffle array
    return arr;
    }



    //variables for the functionality of the game

    var randomCountry;
    var score;
    var count;
    var cityClicked;
    var winningscore;
    //will be passed when the function is called
    function gameInit(){
    //calculate the number of correct
    winningscore = Math.round(3*2)

    //the score variable
    score = 0;
    //is the city clicked yes or no
    cityClicked = false;
    var gameCountries = [];
    var gameCountryCities =[];
    //shuffles the existing countries array
    gameCountries = shuffleArray(countries)
    //loops throught the countries and attached names
    for (i = 0; i<gameCountries.length; i++)
    { 
    document.getElementById('gameCountry').innerHTML += "div class='countryName'    id= '" + gameCountries[i] + "' onclick='CountryClick'(this.id)'><img src='countries/" + gameCountries[i] + ".gif'></div>" ;}
    }
    //reshufflies the cities
    gameCountryCities = shuffleArray(gameCountries)
//loops through the countries and displays the attached cities
for (j = 0; j<gameCountryCities.length; j++ )
{ document.getElementById('gameCity').innerHTML += "<div class='countrycity' id='country-" + gameCountryCities[j] + "' onclick='cityClick(this.id)'><img src= 'cities/" + gameCountryCities[j] + ".gif'></div>" ;
}
}

//when a city is clicked
function cityClick(cityClickedId)
{
if (cityClicked == true)
{
//does the city and country match
if "country-" + selectedCity == cityClickedId)
{
    //add one to the the score
score = score +1;
//show the pop up and score
document.getElementById("gamePopup").style.display = "block";
document.getElementById("gamePopup").style.height = scnHei*2;
document.getElementById("gamePopup").style.display = "block";
document.getElementById("gamePopup").style.top = scnHei+150;
//GAME


//if the score is less than the winning score the player loses
if (score <winningscore){
    gameMessage = "You Lose"
}
//otherwise they win
else {gameMessage = "You Win"}
    //Show the game over pop up within the score
document.getElementById("popupBox").innerHTML = 
"<div>Game Over</div<div>" + gameMessage +
"</div><div>Your Score is : " + score 
+ "</div>";
//show the game over pop up with the score
document.getElementById("gamePopup").style.display = "block";
document.getElementById("gamePopup").style.height = scnHei*2;
document.getElementById("popupBox").style.display = "block";
document.getElementById("popupBox").style.top = scnHei+150;
//After 5 seconds redirect the user to the level select menu
setTimeout(function(){
    window.location = "level.html";
}, 5000);
}

使一个对象的国家和正确的城市在其中:

var country = {
  "Netherlands": {
      capital: "Amsterdam"
  },
  "Belgium": {
      capital: "Brussel"
  }
};
country["Belgium"].capital //returns brussel

检查结果是否与给定答案相同,并根据该

返回真或假
var capitals = ['Amsterdam', 'Brussel', 'Barcelona', 'Berlin', 'Rome'];
var generateQuestion = function(country) {
    var question = {
        1: capitals[Randomizer(1, 5),
        2: capitals[Randomizer(1, 5),
        3: country[country].capital
     }
     return question
}
var Randomizer = function(min, max) {
  return Math.random() * (max - min) + min;
}

现在你只需要随机为你的问题的ID并从那里构建它