add function check and showAnswer

master
ZiYi 4 years ago
parent 660e343582
commit 8384e386ef

@ -1,20 +1,14 @@
$(document).ready(function () { $(document).ready(function () {
var results = Array();
$("#demo").click(function (e) { $("#demo").click(function (e) {
e.preventDefault(); e.preventDefault();
//alert("hello world"); //alert("hello world");
begin(); begin();
console.log(results);
}); });
function begin() { function begin() {
/*var xhr = new XMLHttpRequest(); let tmp;
xhr.open('get', '/begin?begin=1');
xhr.onload = function () {
var response = xhr.responseText;
console.log(response);
var json_data = eval('(' + response + ')');
console.log(json_data);
}
xhr.send(null);*/
$.ajax({ $.ajax({
type: "get", type: "get",
url: "/begin", url: "/begin",
@ -22,23 +16,49 @@ $(document).ready(function () {
success: function (res) { success: function (res) {
switch (res.option) { switch (res.option) {
case "+": case "+":
$("#ul").append("<li>" + res.number_1 + " + " + res.number_2 + " = " + (res.number_1 + res.number_2) + "</li>"); tmp = res.number_1 + res.number_2;
$("#ul").append("<li>" + res.number_1 + " + " + res.number_2 + " = " + "<input class='result'>" + "</li><span class='notice'></span>");
break; break;
case "-": case "-":
$("#ul").append("<li>" + res.number_1 + " - " + res.number_2 + " = " + (res.number_1 - res.number_2) + "</li>"); tmp = res.number_1 - res.number_2;
$("#ul").append("<li>" + res.number_1 + " - " + res.number_2 + " = " + "<input class='result'>" + "</li><span class='notice'></span>");
break; break;
case "/": case "/":
$("#ul").append("<li>" + res.number_1 + " / " + res.number_2 + " = " + (res.number_1 / res.number_2) + "</li>"); tmp = res.number_1 / res.number_2;
$("#ul").append("<li>" + res.number_1 + " / " + res.number_2 + " = " + "<input class='result'>" + "</li><span class='notice'></span>");
break; break;
case "*": case "*":
$("#ul").append("<li>" + res.number_1 + " * " + res.number_2 + " = " + (res.number_1 * res.number_2) + "</li>"); tmp = res.number_1 * res.number_2;
$("#ul").append("<li>" + res.number_1 + " * " + res.number_2 + " = " + "<input class='result'>" + "</li><span class='notice'></span>");
break; break;
default: default:
break; break;
} }
alert(response.number_1 + response.option + response.number_2); results.push(tmp);
} }
}); });
} }
$("#check").click(function (e) {
e.preventDefault();
console.log("get");
var inputs = $("input[class='result']");
var notices = $("span[class='notice']");
for (let i = 0; i < results.length; i++) {
if (inputs.eq(i).val() == results[i]) {
notices.eq(i).text("right");
} else {
notices.eq(i).text("wrong");
}
}
});
$("#show").click(function (e) {
console.log("click");
e.preventDefault();
var inputs = $("input[class='result']");
for (let i = 0; i < results.length; i++) {
inputs.eq(i).val(results[i]);
}
});
}); });

@ -5,13 +5,15 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> <title>四则运算生成器</title>
<script src="/static/js/jquery-3.6.0.min.js"></script> <script src="/static/js/jquery-3.6.0.min.js"></script>
<script src="/static/js/index.js"></script> <script src="/static/js/index.js"></script>
</head> </head>
<body> <body>
<button id="demo">demo</button> <button id="demo">生成题目</button>
<button id="check">检查答案</button>
<button id="show">查看答案</button>
<div class="display"> <div class="display">
<ul id="ul"> <ul id="ul">
</ul> </ul>

Loading…
Cancel
Save