0
Again game "Guess the number"
I don't know, how to say this in English, but I will try and hope that you will not break your brains reading this. Thx. So, at first, appeared some error that didn't exist on PC. (just run the code) Then, how to get rid of the first alert "no input", when you just load? Then, how to make new massages appear from above the block? Then, how to make fixed focus on the input field? https://code.sololearn.com/WeA4XPfr0CF9/?ref=app
1 ответ
+ 7
In your HTML there are a couple of errors/issues. First you're not supposed to ever use a list tag ol/ul as a child of a paragraph tag p.
https://stackoverflow.com/questions/10601345/ul-element-can-never-be-a-child-of-p-element
You should remove the p tag and use CSS of the parent div to get desired layout (padding/margin etc) of the contents.
On line 30 of your HTML you forgot to close the div properly.
change:
<div id="attempts"><div>
to:
<div id="attempts"></div>
In your JS remove line 20. It isn't needed and is causing an error, since getNum() would be attempting to access the DOM before it has been initialized.
You're also missing several semicolons. Check the left gutter for the i's and add the missing semicolons.
Lines 24, 32, 36, 40, 44, 48, and 50.
In order to have the previous answers above the current answer in the attempts block you need to change the order in which you are appending to out.innerHTML in all your else if statements.
For example:
change:
out.innerHTML += "#" + tryCount + ". " + user_answer + " almost equal. Try again<br /><br />";
to:
out.innerHTML = "#" + tryCount + ". " + user_answer + " almost equal. Try again<br /><br />" + out.innerHTML;
You already have autofocus set for the input so all you should need to do is reset the focus back to the input any time that the check button is clicked and then adding an onclick to the body of the page. You can do this by adding the following function to your JS:
function reFocus() {
document.getElementById("num_id").focus();
}
Then add a call to the function at the end of your getNum() function and set the body tags onclick to the reFocus() function as well.
function getNum () {
var user_answer = document.getElementById("num_id").value;
checknum(user_answer);
reFocus();
}
<body onclick="reFocus()">
This should answer all your questions and your code runs without error.