Javascript，我如何从数组中获取两个相应的元素以使用随机功能同时生成？
[英]Javascript, how do i get two corresponding elements from an array to generate at the same time with the random feature?
问题描述
i can´t figure out how to get two items from my array list that belong together to generate at the same time when i use the random feature. 
当我使用随机功能时，我无法弄清楚如何从数组列表中获得两个在一起生成的项。 When i click on the "get Name and Grade" button i want to get a random name in one box and its corresponding Grade in the other. 当我单击“获取名称和等级”按钮时，我想在一个框中获得一个随机名称，在另一个框中获得其相应的等级。 i can only manage to get random names and grades that does not belong together. 我只能设法获得不在一起的随机名称和等级。 How do i fix this? 我该如何解决？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript</title>
<script type="text/javascript">
var names = [];
var grades = [];
names[0]="Klara";
grades[0]="A";
names[1]="Sarah";
grades[1]="A";
names[2]="Andrea";
grades[2]="B";
names[3]="Emil";
grades[3]="C";
names[4]="Victor";
grades[4]="C";
names[5]="Alicia";
grades[5]="D";
names[6]="Thomas";
grades[6]="E";
names[7]="Robert";
grades[7]="E";
function getName()
{
var rand = names[Math.floor(Math.random() * 8)];
return rand;
var box =document.getElementById('getName');getName.value=getName;
}
function box(){
var box =document.getElementById('getName');getName.value=getName;
}
function getGrade()
{
var rand = grades[Math.floor(Math.random() * 8)];
return rand;
var box =document.getElementById('getGrade');getGrade.value=getGrade;
}
function box2(){
var box2 =document.getElementById('getGrade');getGrade.value=getGrade;
}
</script>
</head>
<body>
<form>
<input type="text" name="box" id="box" value=""/> <br/>
<input type="text" name="box2" id="box2" value=""/> <br/>
<input type="button" name="textbox1" id="textbox1" value="get Name and Grade" onclick="document.getElementById('box').value = getName(),document.getElementById('box2').value = getGrade()"/>
</form>
</body>
</html>
2 个解决方案
解决方案1
0 已采纳 2016-11-27 20:23:14
There are really many syntax errors and weird calls in your example, which shall be ignored for now. 您的示例中确实存在许多语法错误和怪异的调用，现在暂时将其忽略。
You could store the data in objects instead, so the data is always stored together: 您可以将数据存储在对象中，因此数据总是存储在一起：
var tName = [
{Name: "Klara", Grade: "A"},
{Name: "Sarah", Grade: "A"}
];
You can then access the values like this: 然后，您可以访问像这样的值：
tName[0].Name;
tName[0].Grade;
Edit: 编辑：
<html>
<head>
<script>
var mName = [
{Name: "Klara", Grade: "A"},
{Name: "Sarah", Grade: "A"},
{Name: "Andrea", Grade: "B"},
{Name: "Emil", Grade: "C"},
{Name: "Victor", Grade: "C"},
{Name: "Alicia", Grade: "D"},
{Name: "Thomas", Grade: "E"},
{Name: "Robert", Grade: "E"}
];
function getName(){
return mName[Math.floor(Math.random() * mName.length)]
}
function setValues(){
var tB1 = document.querySelector('#box');
var tB2 = document.querySelector('#box2');
var tName = getName();
tB1 && (tB1.value = tName.Name);
tB2 && (tB2.value = tName.Grade)
}
</script>
</head>
<body>
<form>
<input type="text" name="box" id="box" value=""/> <br/>
<input type="text" name="box2" id="box2" value=""/> <br/>
<input type="button" name="textbox1" id="textbox1" value="get Name and Grade" onclick="setValues()"/>
</form>
</body>
</html>
解决方案2
0 2016-11-27 21:29:10
Okay so now my code looks like this. 好的，现在我的代码看起来像这样。 When i press the button to get grade and name i get [object Object] in each textbox, can´t figure out how to solve it. 当我按下按钮以获取成绩和名称时，我在每个文本框中都获得了[object Object]，无法解决该问题。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript</title>
<script type="text/javascript">
var tName = [
{Name: "Klara", Grade: "A"},
{Name: "Sarah", Grade: "A"},
{Name: "Andrea", Grade: "B"},
{Name: "Emil", Grade: "C"},
{Name: "Victor", Grade: "C"},
{Name: "Alicia", Grade: "D"},
{Name: "Thomas", Grade: "E"},
{Name: "Robert", Grade: "E"}
];
tName[0].Name;
tName[0].Grade;
tName[1].Name;
tName[1].Grade;
tName[2].Name;
tName[2].Grade;
tName[3].Name;
tName[3].Grade;
tName[4].Name;
tName[4].Grade;
tName[5].Name;
tName[5].Grade;
tName[6].Name;
tName[6].Grade;
tName[7].Name;
tName[7].Grade;
function getName()
{
var rand = tName[Math.floor(Math.random() * tName.length)];
return rand;
var box =document.getElementById('getName');getName.value=getName;
}
function box(){
var box =document.getElementById('getName');getName.value=getName;
}
function box2(){
var box2 =document.getElementById('getName');getName.value=getName;
}
</script>
</head>
<body>
<form>
<input type="text" name="box" id="box" value=""/> <br/>
<input type="text" name="box2" id="box2" value=""/> <br/>
<input type="button" name="textbox1" id="textbox1" value="get Name and Grade" onclick="document.getElementById('box').value = getName(),document.getElementById('box2').value = getName()"/>
</form>
</body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.