Javascript 如何在表单中永久保存值_Javascript_Html

Javascript 如何在表单中永久保存值

javascript html

Javascript 如何在表单中永久保存值,javascript,html,Javascript,Html,单击submit按钮后，从javascript获取的值不会保留在输入区域中。它们只出现了大约一秒钟，然后就消失了 html： <!DOCTYPE html> <html> <head> <title> Assignment Solution on Programming the Internet (Week 4) </title> <meta charset="utf-8" /> <style>

单击submit按钮后，从javascript获取的值不会保留在输入区域中。它们只出现了大约一秒钟，然后就消失了

html：

<!DOCTYPE html> 
<html> 

<head>
 <title> Assignment Solution on Programming the Internet (Week 4)
 </title>
 <meta charset="utf-8" />

<style>
 textarea {
  width: 400px;
  height: 100px;
}

#d{
    width: 50%;
    margin: 10px;
}
#dd{
    margin: 10px;
}
</style>
<script type = "text/javascript" src="JavaScriptValidation.js"></script>
</head>

<body>
<div  id="d">
<h1>Type a Phrase, Count the Vowels</h1>
<form >
<!-- onsubmit = "return validateJS()" -->

 <fieldset> 
    <legend> </legend>
        <p>Input of >=10 Characters Which Includes Vowels</p>
        <textarea id="t" placeholder="Type your word(s)"></textarea>
 </fieldset> 
 <div id="dd">
    <fieldset>
        <legend> The number of vowels</legend>

<!-- <textarea name="p" id="p" rows = "1" cols = "15"></textarea><br /> -->

        <label for="surname"> Letter "a"</label><br />
        <input name = "a" id = "a" type = "text" size ="20" maxlength = "30" value="@Request["inputText"]"/><br />

        <label for="surname"> Letter "e"</label><br />
        <input name = "surname" id = "e" type = "text" size ="20" maxlength = "30" /><br />

        <label for="surname"> Letter "i"</label><br />
        <input name = "surname" id = "i" type = "text" size ="20" maxlength = "30" /><br />

        <label for="surname"> Letter "o"</label><br />
        <input name = "surname" id = "o" type = "text" size ="20" maxlength = "30" /><br />

        <label for="surname"> Letter "u"</label><br />
        <input name = "surname" id = "u" type = "text" size ="20" maxlength = "30" /><br />
    </fieldset>

    <p><input type = "submit" name = "submit" value = "Count Vowels" onclick="countVowels()" /></p>
 </div>
</form>
</div>

</body>

</html>


互联网编程作业解决方案（第4周）
文本区{
宽度：400px；
高度：100px；
}
#d{
宽度：50%；
利润率：10px；
}
#dd{
利润率：10px；
}
键入一个短语，数一数元音
输入>=10个字符，包括元音
元音的数量
字母“a”



字母“e”



字母“i”



字母“o”



字母“u”

javascript：

function validateJS() {
   validateTextBoxes();
   return (validateTextBoxes());
}

function validateTextBoxes() {
var all_input = document.getElementsByTagName("input");
var completed = true;

// for (i = 0; i < all_input.length; i++){
//    if (all_input[i].type === "text"){
//       if (all_input[i].value === ""){
//           alert("You have not filled in "+i+" text box(es)"+u);
//           completed = false;
//         }
//    }
// }
return completed;
}

function countVowels(){
    var z = document.getElementById("t").value;
    var a = z.split("a").length;
    var u = a-1;

    var b = z.split("e").length;
    var c = b-1;

    var d = z.split("i").length;
    var f = d-1;

    var g = z.split("o").length;
    var h = g-1;

    var i = z.split("u").length;
    var j = i-1;

var m = Math.max(u, c, f, h, j);
// document.getElementById("p").value = u;
document.getElementById("a").value = u;
document.getElementById("e").value = c;
document.getElementById("i").value = f;
document.getElementById("o").value = h;
document.getElementById("u").value = j;

if (z.length == 0){
    alert("You have not filled in the text box.");
}

if (m == c){
document.getElementById("b").style.backgroundColor = "red";
alert(l+"no of a: "+u+"   no of e: "+c+"   no of i: "+f+"   no of o: "+h+"   no of u: "+j);
}

alert(l+"no of a: "+u+"   no of e: "+c+"   no of i: "+f+"   no of o: "+h+"   no of u: "+j);

 return false;
}

函数validateJS（）{
validateTextBox（）；
返回（validateTextBox（））；
}
函数validateTextBox（）{
var all_input=document.getElementsByTagName（“输入”）；
var完成=真；
//对于（i=0；i


请帮忙。谢谢您将丢失这些值，因为表单正在提交页面。
您必须在表单提交时返回false，这样它就不会再次导航。
您应该执行以下操作

正如我在代码中看到的，您有未处理的异常，这些异常永远不会允许您的代码返回false

我建议
function countVowels() {

    try {
        var z = document.getElementById("t").value;
        var a = z.split("a").length;
        var u = a - 1;

        var b = z.split("e").length;
        var c = b - 1;

        var d = z.split("i").length;
        var f = d - 1;

        var g = z.split("o").length;
        var h = g - 1;

        var i = z.split("u").length;
        var j = i - 1;
        debugger;
        var m = Math.max(u, c, f, h, j);
        // document.getElementById("p").value = u;
        document.getElementById("a").value = u;
        document.getElementById("e").value = c;
        document.getElementById("i").value = f;
        document.getElementById("o").value = h;
        document.getElementById("u").value = j;

        if (z.length == 0) {
            alert("You have not filled in the text box.");
        }

        if (m == c) {
            document.getElementById("b").style.backgroundColor = "red";
            alert(l + "no of a: " + u + "   no of e: " + c + "   no of i: " + f + "   no of o: " + h + "   no of u: " + j);
        }

        alert(l + "no of a: " + u + "   no of e: " + c + "   no of i: " + f + "   no of o: " + h + "   no of u: " + j);
    } catch (e) {
        alert(e)
    }

    return false;

}

在onclick事件之前发送表单
您应该做的是：制作一个不是type=“submit”的按钮
将onclick事件添加到其中（就像您已经添加的一样）
将ID添加到表单中
并将此添加到您的scipt（最后）：
尝试将“提交”按钮更改为“键入”按钮
var form = document.getElementById("form-id");
form.submit();