javascript - 如何比较两个值并返回正确答案javascript,以及如何只调用一次函数javascript

标签 javascript html forms input

我正在尝试创建一个游戏,您可以将随机国家/地区的最后一个字母与新国家/地区的第一个字母相匹配。 我把所有国家都放在一个数组中。我能够在屏幕上显示随机国家,但如果此人再次单击,则会出现一个新国家并删除旧国家。 我希望它只能点击一次,而您只能停留在它显示的第一个国家/地区。

我在制作 if 语句来测试它们是否真的通过了所有测试时遇到了问题

1) 确保随机国家的最后一个字母与用户输入的国家的第一个字母相匹配。

2) 确保它确实在我定义的国家/地区数组中。

3) 确保它不是空字符串

4) 确保他们之前没有使用过那个国家

我知道要问的问题很多,但我已经被困了一段时间,我真的可以求助于更有经验的人

非常感谢建设性的批评,如果您有任何建议可以使我的代码运行得更快、可读性等,请告诉我

提前致谢

这是我的代码示例

function randomCountry () {
  var tries = 0;
  var temp = country[sr];
  var input = document.getElementById("random-country").value
  var val = document.getElementById("gues").value
  var sr = Math.floor(Math.random()*256)
  var startCountry = document.getElementById("random-country").innerHTML = country[sr];
}

function enterCountry () {
var val = document.getElementById("gues").value
var node = document.createElement("LI").value
var textNode = document.createTextNode(val)
var a = document.body.appendChild(textNode).value;
var temp = country[sr];
var sr = Math.floor(Math.random()*256)
var startCountry = document.getElementById("random-country").value
alert(startCountry)
alert(val)
if(startCountry.substr(startCountry.length - 1) === val.substr(val.length - 0)) {
alert("correct")
} else  {
alert("incorrect")
}
}
// it is getting the value from the id at line 14 

function newGame()
 {
 
  if(window.confirm("Do you want to start a new game?"))
  {
 
     window.location.reload();  /* reloads the page for a new game */
 
     document.form1.hint.value = "Enter your guess below and click on Guess!";
 
  }
 
 }

// var le = country.length;

var country = [
"Afghanistan",
"Akrotiri",
"Albania",
"Algeria",
"American Samoa",
"Andorra",
"Angola",
"Anguilla",
"Antarctica",
"Antigua and Barbuda",
"Argentina",
"Armenia",
"Aruba",
"Ashmore and Cartier Islands",
"Australia",
"Austria",
"Azerbaijan",
"Bahamas The",
"Bahrain",
"Bangladesh",
"Barbados",
"Bassas da India",
"Belarus",
"Belgium",
"Belize",
"Benin",
"Bermuda",
"Bhutan",
"Bolivia",
"Bosnia and Herzegovina",
"Botswana",
"Bouvet Island",
"Brazil",
"British Indian Ocean Territory",
"British Virgin Islands",
"Brunei",
"Bulgaria",
"Burkina Faso",
"Burma",
"Burundi",
"Cambodia",
"Cameroon",
"Canada",
"Cape Verde",
"Cayman Islands",
"Central African Republic",
"Chad",
"Chile",
"China",
"Christmas Island",
"Clipperton Island",
"Cocos Islands",
"Colombia",
"Comoros",
"Democratic Republic of the Congo",
"Republic of the Congo",
"Cook Islands",
"Coral Sea Islands",
"Costa Rica",
"Cote d Ivoire",
"Croatia",
"Cuba",
"Cyprus",
"Czech Republic",
"Denmark",
"Dhekelia",
"Djibouti",
"Dominica",
"Dominican Republic",
"Ecuador",
"Egypt",
"El Salvador",
"Equatorial Guinea",
"Eritrea",
"Estonia",
"Ethiopia",
"Europa Island",
"Falkland Islands (Islas Malvinas)",
"Faroe Islands",
"Fiji",
"Finland",
"France",
"French Guiana",
"French Polynesia",
"French Southern and Antarctic Lands",
"Gabon",
"Gambia",
"Gaza Strip",
"Georgia",
"Germany",
"Ghana",
"Gibraltar",
"Glorioso Islands",
"Greece",
"Greenland",
"Grenada",
"Guadeloupe",
"Guam",
"Guatemala",
"Guernsey",
"Guinea",
"Guinea Bissau",
"Guyana",
"Haiti",
"Heard Island and McDonald Islands",
"Vatican City",
"Honduras",
"Hong Kong",
"Hungary",
"Iceland",
"India",
"Indonesia",
"Iran",
"Iraq",
"Ireland",
"Isle of Man",
"Israel",
"Italy",
"Jamaica",
"Jan Mayen",
"Japan",
"Jersey",
"Jordan",
"Juan de Nova Island",
"Kazakhstan",
"Kenya",
"Kiribati",
"North Korea",
"South Korea",
"Kuwait",
"Kyrgyzstan",
"Laos",
"Latvia",
"Lebanon",
"Lesotho",
"Liberia",
"Libya",
"Liechtenstein",
"Lithuania",
"Luxembourg",
"Macau",
"Macedonia",
"Madagascar",
"Malawi",
"Malaysia",
"Maldives",
"Mali",
"Malta",
"Marshall Islands",
"Martinique",
"Mauritania",
"Mauritius",
"Mayotte",
"Mexico",
"Micronesia",
"Moldova",
"Monaco",
"Mongolia",
"Montserrat",
"Morocco",
"Mozambique",
"Namibia",
"Nauru",
"Navassa Island",
"Nepal",
"Netherlands",
"Netherlands Antilles",
"New Caledonia",
"New Zealand",
"Nicaragua",
"Niger",
"Nigeria",
"Niue",
"Norfolk Island",
"Northern Mariana Islands",
"Norway",
"Oman",
"Pakistan",
"Palau",
"Panama",
"Papua New Guinea",
"Paracel Islands",
"Paraguay",
"Peru",
"Philippines",
"Pitcairn Islands",
"Poland",
"Portugal",
"Puerto Rico",
"Qatar",
"Reunion",
"Romania",
"Russia",
"Rwanda",
"Saint Helena",
"Saint Kitts and Nevis",
"Saint Lucia",
"Saint Pierre and Miquelon",
"Saint Vincent and the Grenadines",
"Samoa",
"San Marino",
"Sao Tome and Principe",
"Saudi Arabia",
"Senegal",
"Serbia and Montenegro",
"Seychelles",
"Sierra Leone",
"Singapore",
"Slovakia",
"Slovenia",
"Solomon Islands",
"Somalia",
"South Africa",
"South Georgia and the South Sandwich Islands",
"Spain",
"Spratly Islands",
"Sri Lanka",
"Sudan",
"Suriname",
"Svalbard",
"Swaziland",
"Sweden",
"Switzerland",
"Syria",
"Taiwan",
"Tajikistan",
"Tanzania",
"Thailand",
"Timor-Leste",
"Togo",
"Tokelau",
"Tonga",
"Trinidad and Tobago",
"Tromelin Island",
"Tunisia",
"Turkey",
"Turkmenistan",
"Turks and Caicos Islands",
"Tuvalu",
"Uganda",
"Ukraine",
"United Arab Emirates",
"United Kingdom",
"United States",
"Uruguay",
"Uzbekistan",
"Vanuatu",
"Venezuela",
"Vietnam",
"Virgin Islands",
"Wake Island",
"Wallis and Futuna",
"West Bank",
"Western Sahara",
"Yemen",
"Zambia",
"Zimbabwe"
]



// var sr = Math.Floor(Math.Random() *180)
// var temp = country[sr]
// var tries= 0
// var country = newArray(180)
body {
	
}

button {
    height: 80px;
    width: 80px;
}

div {
    height:100px;
    width:100px;
}
<!DOCTYPE html>
<html>
	<head>
		<title>The Country Game</title>
	</head>
	<body>
	    <h3>Welcome to my first game!</h3>
	    <h4>How to play</h4>
	    <button id="random-country" onClick="randomCountry()" type="button" value="randomCountry()">Click me to start!</button>
	    <p>Match the last letter of the country shown above to the first letter of a new country that has not been named yet. </p>
	    <div id="guess">
	        <ul id="guesses">
	            <li>
	            <li>
	                
	            </li>
	        </li>
	        </ul>
	        <input id="gues" type="text" placeholder="enter here">
	        </div>
	    <form>
		<button id="answer" onClick="enterCountry()" type="button">Enter Country</button>
		<button id="new-game" onClick="newGame()" type="button">New Game</button>
		<button id="list-eraser" onClick="eraseList()" type="button">Erase List</button>

		</form>
	</body>
</html>

最佳答案

Edit 2

您永远不必将随机值保存在函数范围之外的变量中,并且每次都重新设置它,因此您永远不会获得该值。

我这样改变了变量的范围:

var startCountry
    function randomCountry () {
      var tries = 0;
      var temp = country[sr];
      var input = document.getElementById("random-country").value
      var val = document.getElementById("gues").value
      var sr = Math.floor(Math.random()*256)
      startCountry = document.getElementById("random-country").innerHTML = country[sr];
    }

然后将另一个函数更改为只使用变量,而不是重新释放它:

function enterCountry () {
var val = document.getElementById("gues").value
var node = document.createElement("LI").value
var textNode = document.createTextNode(val)
var a = document.body.appendChild(textNode).value;
var temp = country[sr];
var sr = Math.floor(Math.random()*256)
alert(startCountry)
alert(val)
if(startCountry.toUpperCase().substr(startCountry.length - 1) === val.toUpperCase().substr(0,1)) {
alert("correct")
} else  {
alert("incorrect")
}
}

如果你想比较随机国家的最后一个和输入国家的第一个,你可以这样做:

if(startCountry.substr(startCountry.length - 1) === val.charAt(0))

Finally the code bellow all together works:

var startCountry
function randomCountry () {
  var tries = 0;
  var temp = country[sr];
  var input = document.getElementById("random-country").value
  var val = document.getElementById("gues").value
  var sr = Math.floor(Math.random()*256)
  startCountry = document.getElementById("random-country").innerHTML = country[sr];
}

function enterCountry () {
var val = document.getElementById("gues").value
var node = document.createElement("LI").value
var textNode = document.createTextNode(val)
var a = document.body.appendChild(textNode).value;
var temp = country[sr];
var sr = Math.floor(Math.random()*256)
alert(startCountry)
alert(val)
if(startCountry.substr(startCountry.length - 1).toUpperCase() === val.charAt(0).toUpperCase()) {
alert("correct")
} else  {
alert("incorrect")
}
}
// it is getting the value from the id at line 14 

function newGame()
 {
 
  if(window.confirm("Do you want to start a new game?"))
  {
 
     window.location.reload();  /* reloads the page for a new game */
 
     document.form1.hint.value = "Enter your guess below and click on Guess!";
 
  }
 
 }

// var le = country.length;

var country = [
"Afghanistan",
"Akrotiri",
"Albania",
"Algeria",
"American Samoa",
"Andorra",
"Angola",
"Anguilla",
"Antarctica",
"Antigua and Barbuda",
"Argentina",
"Armenia",
"Aruba",
"Ashmore and Cartier Islands",
"Australia",
"Austria",
"Azerbaijan",
"Bahamas The",
"Bahrain",
"Bangladesh",
"Barbados",
"Bassas da India",
"Belarus",
"Belgium",
"Belize",
"Benin",
"Bermuda",
"Bhutan",
"Bolivia",
"Bosnia and Herzegovina",
"Botswana",
"Bouvet Island",
"Brazil",
"British Indian Ocean Territory",
"British Virgin Islands",
"Brunei",
"Bulgaria",
"Burkina Faso",
"Burma",
"Burundi",
"Cambodia",
"Cameroon",
"Canada",
"Cape Verde",
"Cayman Islands",
"Central African Republic",
"Chad",
"Chile",
"China",
"Christmas Island",
"Clipperton Island",
"Cocos Islands",
"Colombia",
"Comoros",
"Democratic Republic of the Congo",
"Republic of the Congo",
"Cook Islands",
"Coral Sea Islands",
"Costa Rica",
"Cote d Ivoire",
"Croatia",
"Cuba",
"Cyprus",
"Czech Republic",
"Denmark",
"Dhekelia",
"Djibouti",
"Dominica",
"Dominican Republic",
"Ecuador",
"Egypt",
"El Salvador",
"Equatorial Guinea",
"Eritrea",
"Estonia",
"Ethiopia",
"Europa Island",
"Falkland Islands (Islas Malvinas)",
"Faroe Islands",
"Fiji",
"Finland",
"France",
"French Guiana",
"French Polynesia",
"French Southern and Antarctic Lands",
"Gabon",
"Gambia",
"Gaza Strip",
"Georgia",
"Germany",
"Ghana",
"Gibraltar",
"Glorioso Islands",
"Greece",
"Greenland",
"Grenada",
"Guadeloupe",
"Guam",
"Guatemala",
"Guernsey",
"Guinea",
"Guinea Bissau",
"Guyana",
"Haiti",
"Heard Island and McDonald Islands",
"Vatican City",
"Honduras",
"Hong Kong",
"Hungary",
"Iceland",
"India",
"Indonesia",
"Iran",
"Iraq",
"Ireland",
"Isle of Man",
"Israel",
"Italy",
"Jamaica",
"Jan Mayen",
"Japan",
"Jersey",
"Jordan",
"Juan de Nova Island",
"Kazakhstan",
"Kenya",
"Kiribati",
"North Korea",
"South Korea",
"Kuwait",
"Kyrgyzstan",
"Laos",
"Latvia",
"Lebanon",
"Lesotho",
"Liberia",
"Libya",
"Liechtenstein",
"Lithuania",
"Luxembourg",
"Macau",
"Macedonia",
"Madagascar",
"Malawi",
"Malaysia",
"Maldives",
"Mali",
"Malta",
"Marshall Islands",
"Martinique",
"Mauritania",
"Mauritius",
"Mayotte",
"Mexico",
"Micronesia",
"Moldova",
"Monaco",
"Mongolia",
"Montserrat",
"Morocco",
"Mozambique",
"Namibia",
"Nauru",
"Navassa Island",
"Nepal",
"Netherlands",
"Netherlands Antilles",
"New Caledonia",
"New Zealand",
"Nicaragua",
"Niger",
"Nigeria",
"Niue",
"Norfolk Island",
"Northern Mariana Islands",
"Norway",
"Oman",
"Pakistan",
"Palau",
"Panama",
"Papua New Guinea",
"Paracel Islands",
"Paraguay",
"Peru",
"Philippines",
"Pitcairn Islands",
"Poland",
"Portugal",
"Puerto Rico",
"Qatar",
"Reunion",
"Romania",
"Russia",
"Rwanda",
"Saint Helena",
"Saint Kitts and Nevis",
"Saint Lucia",
"Saint Pierre and Miquelon",
"Saint Vincent and the Grenadines",
"Samoa",
"San Marino",
"Sao Tome and Principe",
"Saudi Arabia",
"Senegal",
"Serbia and Montenegro",
"Seychelles",
"Sierra Leone",
"Singapore",
"Slovakia",
"Slovenia",
"Solomon Islands",
"Somalia",
"South Africa",
"South Georgia and the South Sandwich Islands",
"Spain",
"Spratly Islands",
"Sri Lanka",
"Sudan",
"Suriname",
"Svalbard",
"Swaziland",
"Sweden",
"Switzerland",
"Syria",
"Taiwan",
"Tajikistan",
"Tanzania",
"Thailand",
"Timor-Leste",
"Togo",
"Tokelau",
"Tonga",
"Trinidad and Tobago",
"Tromelin Island",
"Tunisia",
"Turkey",
"Turkmenistan",
"Turks and Caicos Islands",
"Tuvalu",
"Uganda",
"Ukraine",
"United Arab Emirates",
"United Kingdom",
"United States",
"Uruguay",
"Uzbekistan",
"Vanuatu",
"Venezuela",
"Vietnam",
"Virgin Islands",
"Wake Island",
"Wallis and Futuna",
"West Bank",
"Western Sahara",
"Yemen",
"Zambia",
"Zimbabwe"
]



// var sr = Math.Floor(Math.Random() *180)
// var temp = country[sr]
// var tries= 0
// var country = newArray(180)
body {
	
}

button {
    height: 80px;
    width: 80px;
}

div {
    height:100px;
    width:100px;
}
<!DOCTYPE html>
<html>
	<head>
		<title>The Country Game</title>
	</head>
	<body>
	    <h3>Welcome to my first game!</h3>
	    <h4>How to play</h4>
	    <button id="random-country" onClick="randomCountry()" type="button" value="randomCountry()">Click me to start!</button>
	    <p>Match the last letter of the country shown above to the first letter of a new country that has not been named yet. </p>
	    <div id="guess">
	        <ul id="guesses">
	            <li>
	            <li>
	                
	            </li>
	        </li>
	        </ul>
	        <input id="gues" type="text" placeholder="enter here">
	        </div>
	    <form>
		<button id="answer" onClick="enterCountry()" type="button">Enter Country</button>
		<button id="new-game" onClick="newGame()" type="button">New Game</button>
		<button id="list-eraser" onClick="eraseList()" type="button">Erase List</button>

		</form>
	</body>
</html>

关于javascript - 如何比较两个值并返回正确答案javascript,以及如何只调用一次函数javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44749326/

相关文章:

javascript - AngularJS ng-重复数组数组

javascript - 我不明白为什么我会陷入无限循环

javascript - 警告在设定时间内消失

c# - 显示验证消息

javascript - 文本字段附近的按钮不显示在选项卡面板内的表单中

javascript - 使用 Javascript 选择单个表单

php - 每 3 项和 4 项交替

html - 表单底部的 CSS 页脚,而不是正文/页面

html - 删除表格边框

javascript - Rails/Ajax 将表单从创建更改为提交后更新