Question

这是我的代码，我担心某些变量没有正确定位。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Memory Test</title>
        <link href="bio.css" rel="stylesheet" type="text/css">
        <script src="../jquery-1.5.min.js" type="text/javascript"></script>
    </head>
    <body onLoad="timeMsg()">
        <div id="container">
            <h3>The numbers are...</h3>
            <input id="number" type="text" value="495"/>
            <div id="remember">

            </div>
            <div id="email">
                <input id="a"></input>
                <input id="b"></input>
                <input id="c"></input>
                <input id="d"></input>
                <input id="e"></input>
                <input id="f"></input>
                <input id="g"></input>
                <input id="h"></input>
                <input id="i"></input>
            </div>
            <script>
            var a = document.getElementById("a").value;
            var b = document.getElementById("b").value;
            var c = document.getElementById("c").value;
            var d = document.getElementById("d").value;
            var e = document.getElementById("e").value;
            var f = document.getElementById("f").value;
            var g = document.getElementById("g").value;
            var h = document.getElementById("h").value;
            var i = document.getElementById("i").value;


            function timeMsg()
            {
            var t=setTimeout("alertMsg()",500);
            }
            function alertMsg()
            {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="one" id="one" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet()"/>');
                document.getElementById('number').value = 'no cheating...';
                }

            function changeSet() {
                var s=setTimeout("alertYea()",500);
                var a = document.getElementById('a').innerHTML = (document.getElementById("one").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">2</p>');
                document.getElementById('number').value = '9264';
            }
            function alertYea() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="two" id="two" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet2()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet2() {
                var a=setTimeout("alertYea2()",500);
                var b = document.getElementById('b').innerHTML = (document.getElementById("two").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">3</p>');
                document.getElementById('number').value = '38671';
            }

            function alertYea2() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="three" id="three" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet3()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet3() {
                var a=setTimeout("alertYea3()",500);
                var c = document.getElementById('c').innerHTML = (document.getElementById("three").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">4</p>');
                document.getElementById('number').value = '938263';
            }

            function alertYea3() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="four" id="four" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet4()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet4() {
                var a=setTimeout("alertYea4()",500);
                var d = document.getElementById('d').innerHTML = (document.getElementById("four").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">5</p>');
                document.getElementById('number').value = '8351032';
            }

            function alertYea4() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="five" id="five" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet5()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet5() {
                var a=setTimeout("alertYea5()",500);
                var e = document.getElementById('e').innerHTML = (document.getElementById("five").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">6</p>');
                document.getElementById('number').value = '02619815';
            }

            function alertYea5() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="six" id="six" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet6()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet6() {
                var a=setTimeout("alertYea6()",500);
                var f = document.getElementById('f').innerHTML = (document.getElementById("six").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">7</p>');
                document.getElementById('number').value = '274619523';
            }

            function alertYea6() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="seven" id="seven" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet7()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet7() {
                var a=setTimeout("alertYea7()",500);
                var g = document.getElementById('g').innerHTML = (document.getElementById("seven").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">8</p>');
                document.getElementById('number').value = '1681324849';
            }

            function alertYea7() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="eight" id="eight" type="text"></input></br><input id="answer" type="button" value="Next" onClick="changeSet8()"/>');
                document.getElementById('number').value = 'no cheating...';

                }

            function changeSet8() {
                var a=setTimeout("alertYea8()",500);
                var h = document.getElementById('h').innerHTML = (document.getElementById("eight").value);
                document.getElementById('remember').innerHTML = ('<p id="bumper">9</p>');
                document.getElementById('number').value = '48372605629';
                emailData.data.value = h;
            }

            function alertYea8() {
                document.getElementById('remember').innerHTML = ('<h3>Times up partner, what were they?</h3></br><input name="nine" id="nine" type="text"></input></br><p id="send"></p><input id="answer" name="submit" type="button" onclick="finals()" value="Next"/>');
                document.getElementById('number').value = 'no cheating...';

                }
            function finals() {
                var i = document.getElementById('i').innerHTML = (document.getElementById("nine").value);
                document.getElementById('remember').innerHTML = ('<div id="send"><form action="mailto:hubridnoxx@gmail.com" method="POST" enctype="text/plain" name="emailData"></br><input id="data" type="text" size="20" name="data"><br><input type="submit" value="Submit and continue to letters!"></form></div>');

                emailData.data.value = a + b + c + d + e + f + g + h + i;
                var total= 0;
                $('input', '#email').each(function () {
                    total += parseInt($(this).val());
                });
                emailData.data.value = total;
                }
            </script>

        </div>
    </body>
</html>

问题出在最后一行，

emailData.data.value = a + b + c + d + e + f + g + h + i; 该页面仅返回输入id i的值，而不是输入id a-h。相反，它为每个输入id值显示大量[object HTMLInputElement]。我甚至打电话给.value。我该如何解决这个问题

emailData.data.value = a + b + c + d + e + f + g + h + i; 改为显示一组相应的值？

Answer 1

每个范围只应使用一个var声明。所以，像这样：

var a = document.getElementById("a").value,
    b = document.getElementById("b").value; // and so on

如果你愿意，你也可以使用jQuery简化代码，这样你就不必那么多地使用document.getElementById（或为document.getElementById制作一个更短的变量）

var a = $("#a").val(),
    b = $("#b").val();
...
function alertMsg(){
  $("#remember").html("...");
}

您还在另一个范围内重新声明了一些全局变量，并尝试获取/设置文本输入的innerHTML。这不起作用。

function changeSet(){
 var a = ...; // <- this line and others in other functions
}

Javascript Var Scope帮助

1 个答案: