函数未接收来自<表单>标签
Function not receiving receiving userinput from <form> tag
我正在尝试制作一个涉及音乐间歇游戏的简单程序。它会让用户尝试用一组给定的笔记来回答正确的间隔。但是,我的check()
函数有问题,它将读取用户的答案并用正确的答案进行检查。问题是,当我运行程序并尝试单击check
按钮时,我不会得到任何响应。
这是JavaScript代码:
var notes = ['A','B','C','D','E','F','G'];
var accidentals = ['b','#'];
var notesFull = [];
for (var i = 0; i < notes.length; i++) {
notesFull.push(notes[i] + accidentals[0]);
notesFull.push(notes[i]);
notesFull.push(notes[i] + accidentals[1]);
}
notesFull.splice(5,2);
notesFull.splice(12,2);
var intervals = ["U", "m2", "M2", "m3", "M3", "P4", "T", "P5", "m6", "M6", "m7", "M7"];
function game() {
var setIntOne = Math.floor(Math.random()*notesFull.length);
var setIntTwo = Math.floor(Math.random()*notesFull.length);
var oneToTwo = setIntOne - setIntTwo;
if (oneToTwo < 0) {
oneToTwo = oneToTwo * -1
}
var ques = "What is the interval going UP from " + notesFull[setIntTwo] + " to " + notesFull[setIntOne] + "?";
document.getElementById("ques").innerHTML = ques;
}
function check() {
var usrInp = document.getElementById("usrInp");
if (usrInp.elements[0].value === intervals[oneToTwo]) {
var resp = "Correct!";
}
else if (usrInp.elements[0].value === "null") {
var resp = "Please input an interval";
}
else {
var resp = "Sorry! Try again";
}
document.getElementById("resp").innerHTML = resp;
}
这是HTML代码:
<button onclick="game()">Click here for test</button>
<p id="ques"></p>
<form id="usrInp">
Type Answer Here: <input type="text" name="usrAns">
</form>
<button onclick="check()">Check</button>
<p id="resp"></p>
在浏览器中检查控制台:
"oneToTwo未定义"
也许您可以将var oneToTwo
移到函数之外。
例如:
var notes = ['A','B','C','D','E','F','G'];
var accidentals = ['b','#'];
var notesFull = [];
var oneToTwo;
for (var i = 0; i < notes.length; i++) {
notesFull.push(notes[i] + accidentals[0]);
notesFull.push(notes[i]);
notesFull.push(notes[i] + accidentals[1]);
}
notesFull.splice(5,2);
notesFull.splice(12,2);
var intervals = ["U", "m2", "M2", "m3", "M3", "P4", "T", "P5", "m6", "M6", "m7", "M7"];
function game() {
var setIntOne = Math.floor(Math.random()*notesFull.length);
var setIntTwo = Math.floor(Math.random()*notesFull.length);
oneToTwo = setIntOne - setIntTwo;
if (oneToTwo < 0) {
oneToTwo = oneToTwo * -1
}
var ques = "What is the interval going UP from " + notesFull[setIntTwo] + " to " + notesFull[setIntOne] + "?";
document.getElementById("ques").innerHTML = ques;
}
function check() {
var usrInp = document.getElementById("usrInp");
if (usrInp.elements[0].value === intervals[oneToTwo]) {
var resp = "Correct!";
}
else if (usrInp.elements[0].value === "null") {
var resp = "Please input an interval";
}
else {
var resp = "Sorry! Try again";
}
document.getElementById("resp").innerHTML = resp;
}
相关文章:
- 在<页眉>标签
- 如何更改<svg>标记为<img>用js标记
- 如何逃离<>在javascript下划线模板中
- 有没有一种方法可以检测ios<>使用jquery和触发器操作形成导航按钮
- 正则表达式,它允许除“”之外的所有字符<>_;{}[]”;
- ajax调用:响应<->数据类型
- 如果所有三个文本框<>然后是100%
- CORS的问题.烧瓶<->AngularJS
- 有没有一种方法可以创建与Java<->JSON映射对象,如JSON.stringfy(jsObject)创建的
- 什么是%<>%调用了语法
- JavaScript返回值:What dos<>意思是
- JavaScript中哪种类型的值对应于Java`List<>`
- 如何发送类似“<>"在参数中使用$.ajax-to-server
- 不等于<>操作员不工作
- jquery附加函数转换<>到实体名称
- 只有当超过3个元素时才显示更多内容按钮,否则不显示.使用jquery's:lt:gt
- 为什么在<>ckeditor中不支持
- url有效性的Java脚本regexp,带有<>
- 设计Javascript前端<->C++后端通信
- 比较查询运算符ObjectId<->日期