[英]Check if index of one array is equal to index of another
Basically I have two arrays, One containing 1-30 in french and the other containing 1-30 in english. 基本上,我有两个数组,一个包含1-30的法语,另一个包含1-30的英语。 What i've been trying to do is check if the user picks the right translation for the french number.
我一直试图做的是检查用户是否为法语号码选择了正确的翻译。 This is done in the format of a select menu.
这以选择菜单的格式完成。 5 random numbers are used to pick 5 english words from the english word array and they are then put into a select menu.
使用5个随机数从英语单词数组中选择5个英语单词,然后将它们放入选择菜单中。 At the moment when I click submit guess, it will say every ENGLISH translation is the same as my French word!
当我单击“提交猜测”时,它将说每个英语翻译都与我的法语单词相同!
number = random = Math.floor((Math.random() * 30));
round = Math.round(number);
number = round;
function wordGen()
{
var RanNumbers = new Array(6); //Holds the generated Numbers.
for (var j = 0; j < RanNumbers.length; j++)
{
var temp = 0;
do
{
temp = Math.floor(Math.random() * 30);
}while (RanNumbers.indexOf(temp) > -1)
RanNumbers[j] = temp;
}
//Instead give user option of 5 answers to choose from
//Only one answer can be true.
foreignWords = new Array('un', 'deux', 'trois','quatre', 'cinq', 'six', 'sept','huit', 'neuf','dix','onze', 'douze', 'treize', 'quatorze','quinze','seize', 'dix-sept', 'dix-huit', 'dix-neuf', 'vingt', 'vingt et un','vingt-deux', 'vingt-trois', 'vingt-quatre', 'vingt-cinq', 'vingt-six', 'vingt-sept', 'vingt-huit', 'vingt-neuf', 'trente');
var translate = new Array('one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen', 'twenty', 'twenty-one', 'twenty-two', 'twenty-three', 'twenty-four', 'twenty-five', 'twenty-six', 'twenty-seven', 'twenty-eight', 'twenty-nine', 'thirty');
output = '';
randomWord = foreignWords[number];
correctAns = translate[number];
document.getElementById('generatedWord').innerHTML = randomWord;
var guessed = document.getElementById('guessed').value;
var guess = "<select name='guesses' id='guesses'>";
for(var i = 0; i < 6; i++)
{
guess += "<option value='" + i + "'>" + translate[RanNumbers[i]] + "</option>";
}
guess += '<option value="6">'+correctAns+'</option';
guess += "</select>";
document.getElementById('output').innerHTML = guess;
numGuessed = document.getElementById('guesses').value;
//What I have tried ATM, THis will say every answer is correct!
document.getElementById('submitAns').onclick = function(){
if(foreignWords.indexOf(number) === correctAns.indexOf(number)){
alert("Correct");
}
else{
alert('Incorrect');
}
}
}
<div data-role="page" id="page">
<div data-role="header">
<h1>Page One</h1>
</div>
<div data-role="content">
<h2 style="color:rgba(0,153,204,1);">Guess what the generated french word translates to in English!</h2><br />
<p align="center" id="generatedWord"></p>
<input type="button" value="Generate Word" onClick="wordGen();" />
<br />
<input type="text" id="guessed" />
<div align="center" id="output"></div>
<br />
<input type="button" id="submitAns" value="Submit Guess" />
</div>
So at the moment my if statment says every english word is the correct answer. 因此,目前我的if语句说的每个英语单词都是正确的答案。 In my HTML page I only have 2 buttons, one to run the function (display french word and select menu) and the other button is to submit the guess.
在我的HTML页面中,我只有2个按钮,一个用于运行功能(显示法语单词并选择菜单),另一个按钮用于提交猜测。 ***If I need to use jquery I will but i'd prefer to use plain javascript!
***如果我需要使用jQuery,我会但我更喜欢使用普通的javascript!
I'm not positive, since I'm not sure how you're displaying your foreign word and non-foreign words, however, I would think that: 我不太肯定,因为我不确定您如何显示外来词和非外来词,但是,我认为:
numGuessed === number
Should work, since from what I can tell, numGuessed
in the index of the word guessed, and number
is the index of the word to be translated. 应该可以用,因为据我所知,
numGuessed
在猜单词的索引中,而number
是要翻译的单词的索引。
If that doesn't work, please clarify in your question how the HTML works, and let me know that you've edited and I will edit my answer. 如果这不起作用,请在您的问题中澄清HTML的工作原理,并告知您您已经编辑了,我将编辑答案。
There are a couple of problems I see with the logic of your code right away. 我马上就发现代码逻辑有几个问题。 I will mention them first.
我会首先提到他们。
You are trying to get the value of an element with id
"guessed". 您正在尝试获取
id
“ guessed”的元素的值。 There isn't any element with this id in your html
. 您的
html
没有任何具有此ID的元素。 I'm assuming you are trying to get the value of the select
element with id
"guesses" but that again won't work since you create the element just after you try to get its value. 我假设您正在尝试获取
id
“ guesses”的select
元素的值,但这又一次将不起作用,因为您是在尝试获取其值之后才创建该元素的。
var guessed = document.getElementById('guessed').value; var guess = "<select name='guesses' id='guesses'>"; ...
The variables randomWord
and correctAns
are simple strings that you get out of the index number
from both the arrays that you have created. 变量
randomWord
和correctAns
是简单的字符串,您可以从已创建的两个数组的索引number
获得这些字符串。 So the following statement doesn't make sense: 因此,以下语句没有意义:
foreignWords.indexOf(number) === correctAns.indexOf(number)
It doesn't make sense because correctAns
is a string and therefore it would try to attempt to give you the index
of first occurence of number
as a substring. 这没有任何意义,因为
correctAns
是一个字符串,因此它将尝试尝试将number
的首次出现index
作为子字符串。 foreignWords
is an array and therefore there is clearly a mis-match here. foreignWords
是一个数组,因此这里显然不匹配。
As a matter of fact, you just need to get this logic right, where you are asserting that the user has selected the right answer. 事实上,您只需要弄清楚这个逻辑,即您断言用户选择了正确的答案。 You just need to get the
text
attribute of the selected option
and try to see if that equals the correctAns
variable. 您只需要获取所选
option
的text
属性,然后尝试查看它是否等于正确的correctAns
变量。 You can do that simply by this: 您可以这样简单地做到这一点:
document.getElementById('submitAns').onclick = function () {
var x = document.getElementById("guesses").value; //get the index of selected option
var guessed = document.getElementsByTagName("option")[x].text; //get the text of that option
if (ans === correctAns) {
alert("Correct");
} else {
alert('Incorrect');
}
}
I have created a simple jsfiddle incorporating this code snippet into your logic and seems to be working fine. 我创建了一个简单的jsfiddle,将该代码段纳入您的逻辑中,并且似乎工作正常。 Feel free to play around with it and I hope it gets you started in the right direction.
随意使用它,希望它能帮助您朝正确的方向入手。
Sidenote - I see that you're adding the right answer ie correctAns
always to the bottom of the select
list like so: guess += '<option value="6">'+correctAns+'</option';
旁注 -我看到您在
select
列表的底部始终添加正确的答案,即correctAns
,如下所示: guess += '<option value="6">'+correctAns+'</option';
. 。 That's not random and for someone who uses your program, he/she might see the pattern in a few tries and not get a hang of English numbers :P.
这不是随机的,对于使用您的程序的人来说,他/她可能会在几次尝试中看到该模式,而不会挂起英文数字:P。 Try to take that into account.
尝试考虑到这一点。
Match the number (generated with random number) to translate array index as it is generating the output in foreign array and if it is matched the answer is correct. 匹配数字(使用随机数生成)以转换数组索引,因为它正在生成外部数组中的输出,如果匹配则答案是正确的。
function arrayValueIndex(arr, val){
for(var i=0; i< arr.length; i++) {
if(arr[i] === val) {
return i;
}
}
return false;
}
and in your click event 在您的点击事件中
document.getElementById('submitAns').onclick = function() {
var
genWord = document.getElementById('generatedWord').textContent,
select = document.getElementById('guesses'),
selectedText = select.options[select.selectedIndex].text;
number === arrayValueIndex(translate, selectedText) ? alert("Correct") : alert('Incorrect');
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.