Проще говоря, не используйте document.write()
.Если вы прочтете красивый оранжевый текст в верхней части документации, вы поймете, почему:
Примечание: когда document.write
пишет в документ stream , вызывая document.write
для закрытого (загруженного) документа автоматически вызываются document.open
, , что очистит документ .
document.write()
следует использовать только во время загрузки страницы для выводав то время как это создает веб-страницу, и не должно использоваться впоследствии.Попробуйте создать div и написать вместо него:
function myFunction() {
var at = document.getElementById("email").value.indexOf("@");
var age = document.getElementById("age").value;
var fname = document.getElementById("fname").value;
submitOK = "true";
if (fname.length > 10) {
document.getElementById('result').innerHTML = 'Fname is > 10!';
}
if (isNaN(age) || age < 1 || age > 100) {
alert("The age must be a number between 1 and 100");
submitOK = "false";
}
if (at == -1) {
alert("Not a valid e-mail!");
submitOK = "false";
}
if (submitOK == "false") {
return false;
} else {
alert('Submitted Successfully!');
return false; // Returning false here just for SO Code Snippet
}
}
<form action="/action_page.php" onsubmit="return myFunction()">
Name (max 10 characters): <input type="text" id="fname" size="20" name="fname"><br>
Age (from 1 to 100): <input type="text" id="age" size="20" name="age"><br>
E-mail: <input type="text" id="email" size="20" name="mail"><br><br>
<input type="submit" value="Submit">
<div id="result"></div>
</form>
Кроме того, я заметил, что вы устанавливаете submitOK = "true"
.Javascript имеет логическое значение (см. Также это ).Почему бы не использовать это вместо этого?
submitOK = true;
if (fname.length < 10) {
alert('Your name should be more than 10 characters');
submitOK = false;
}
if (submitOK) { // Same as "if (submitOK == true)"
//Good to go
}