Как удалить значение innerHTML, которое будет показано изначально

1

Я пытаюсь создать таблицу умножения в JavaScript. Пользователю будет предложено указать номер таблицы (от 1 до 10), после которого все вопросительные знаки ('?') Заменяются этим числом. Затем пользователь должен ввести ответы во все предоставленные текстовые поля. Наконец, у пользователя будет возможность проверить ответ (т.е. Правильно или неправильно).

Когда я запускаю свой код. После ввода пользовательских данных в приглашение отображается Incorrect infront каждого textfield поля, и пользователь вводил значение непосредственно перед кнопкой " Check answers. Как я могу удалить их, чтобы они отображались первоначально.

Выход: Мой код:

function result() {
    var value = document.getElementById("a1").value;
    var checkMessageSpan1 = document.getElementById("checkMessage1");
    var checkMessageSpan2 = document.getElementById("checkMessage2");
    var r = x * 1;
    if (value == x) {
    checkMessageSpan1.innerHTML = "<span style=\"color:green\">"+"Correct!";
    }else{
    checkMessageSpan1.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    }



    var value = document.getElementById("a2").value;
    var r = x * 2;
    if (value == r) {
    checkMessageSpan2.innerHTML = "<span style=\"color:green\">"+"Correct!";
    }else{
    checkMessageSpan2.innerHTML = "<span style=\"color:red\">"+"Incorrect!";
    }


</script>
<button onClick="alert_field()"> Generate Question</button><br><br>

<p id="s1">
? x 1 = <input type="text"  id="a1"><span id="checkMessage1"></span><br>
? x 2 = <input type="text"  id="a2"><span id="checkMessage2"></span><br>

</p><br><br>
<p id="a"></p>

Проверить ответы

Теги:

2 ответа

1
Лучший ответ

Попробуйте добавить этот код:

var value = document.getElementById("a1").value;
if (checkMessageSpan1.style.display === "none") {
    checkMessageSpan1.style.display = "inline-block";
} else {
    checkMessageSpan1.style.display = "none";
}

var value = document.getElementById("a2").value;
if (checkMessageSpan2.style.display === "none") {
    checkMessageSpan2.style.display = "inline-block";
} else {
    checkMessageSpan2.style.display = "none";
}
2

Для замены всех специальных символов вы можете использовать регулярные выражения в js var res=str.replace(/[^a-zA-Z0-9]/g,x); вместо var res = str.replace("?",x);

Подробнее о регулярных выражениях в JS https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions

  • 1
    Переключатель 'g', указанный в регулярном выражении выше, выполняет глобальный поиск содержимого переменной x и находит все вхождения специальных символов. Возможно, если бы вы могли разработать конкретный вариант использования, может быть другой подход к этой проблеме.
  • 1
    Я добавил str.replace(/[?]/g,x) и это сработало

Ещё вопросы

Сообщество Overcoder
Наверх
Меню