简体   繁体   English

输入元素上的document.getElementById返回未定义

[英]document.getElementById on an input element returning undefined

I am creating a quid of quizz splitted on mulitple pages and I try to pass the score of each question to the next page using the get method with javascript. 我正在创建一个在多个页面上拆分的测验,然后尝试使用带有javascript的get方法将每个问题的分数传递到下一页。

I use a function called gValue() to get the variables from the previous page (called "s" + the number of the page) in the url, and then I want to add this variable (that I call 'score') to the values of the 3 multiple choices answers on the following page and replicate the whole process over and over. 我使用一个名为gValue()的函数从url中的上一页获取变量(称为“ s” +页数),然后我想将此变量(称为“ score”)添加到3个多项选择的值将在下一页上回答,并一遍又一遍地复制整个过程。

I have a problem with inserting the newscore into the values of each of the radio input fields. 我在将新闻核插入每个单选字段的值时遇到问题。

I don't get any console error nor javascript error but I get "undefined" when I want to check if the new values are added the right way to each input element in the form. 我没有收到任何控制台错误或javascript错误,但是当我想检查新值是否以正确的方式添加到表单中的每个输入元素时,我得到了"undefined" Here is the code of my first page and then of the second page, where I want to see the new values inserted into the form: 这是我第一页的代码,然后是第二页的代码,我想在其中查看插入到表单中的新值:

First page sending the s1 variable: 发送s1变量的首页:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
        <title></title>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <meta name="keywords" content="" />
        <meta name="description" content="" />
        <meta name="robots" content="index, follow" />
        <meta name="googlebot" content="index, follow" />
    </head>
    <body>
        <div>Choose between<br />
            <form name="fo" method="get" action="part1.html">
                <input type="radio" name="s1" value="1" />one<br />
                <input type="radio" name="s1" value="2" />two<br />
                <input type="radio" name="s1" value="3" />three<br />
                <input type="submit" value="continuer" />
            </form>
        </div>
    </body>
</html>

second page, where I want to extract the value of s1 and add it to the values of the 3 inputs in the form: 第二页,我要提取s1的值并将其添加到以下3个输入值的形式:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
        <title></title>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <meta name="keywords" content="" />
        <meta name="description" content="" />
        <meta name="robots" content="index, follow" />
        <meta name="googlebot" content="index, follow" />
        <script type="text/javascript">
            <!--
            function subnewsc() {
                for (i = 1; i <= 3; i++) {
                    var score = gValue();
                    score = parseInt(score);
                    i = parseInt(i);
                    var newscore = score + i;
                    var doc = 'document.getElementById("a' + i + '")';
                    doc.value = newscore;
                }
            }


            function gValue() {
                var url = window.location.href;
                var qparts = url.split("?");

                if (qparts.length == 0) {
                    return "";
                }

                var query = qparts[1];
                var vars = query.split("&");
                var value = "";

                for (var i = 0; i < vars.length; i++) {
                    var parts = vars[i].split("=");
                    for (var f = 1; f <= 3; f++) {
                        var ss = "s" + f;
                        if (parts[0] == ss) {
                            value = parts[1];
                            break;
                        }
                    }
                }
                return value;
            }
            // -->
        </script>
    </head>
    <body>
        <div>choose between<br />
            <form name="fo" method="get" action="part2.html">
                <input id="a1" type="radio" name="s2" value="1" />one again<br />
                <input id="a2" type="radio" name="s2" value="2" />two again<br />
                <input id="a3" type="radio" name="s2" value="3" />three again<br />
                <input type="submit" value="continuer" />
            </form>
            <script type="text/javascript">
                <!--
                var boby = subnewsc();
                document.write(boby);
                //-->
            </script>
        </div>
    </body>
</html> 

I don't know why I am getting undefined when I check using the "boby" variable. 我不知道为什么在使用“ boby”变量检查时变得undefined I first thought that it was because of the DOM, that the function subnewsc() was called too early so that the elements weren't yet there but it shouldn't be the case as I am now calling it later. 我首先以为是因为DOM,所以函数subnewsc()调用太早了,以至于元素尚未出现,但现在不应该了,因为我现在稍后再调用它。

It also doesn't seem to have to do with the nature of the id name in the document.getElementById as it should be a string (a string plus a number becoming a string) 它似乎也与document.getElementById id名称的性质无关,因为它应该是一个字符串(一个字符串加一个数字成为一个字符串)

javascript can be a little funky - mere spaces in code can cause this error, here is an example of what i expierienced, here is a script I wrote: javascript可能有点时髦-代码中仅有空格会导致此错误,这是我经验丰富的示例,这是我编写的脚本:

<select id="mySelect" multiple="multiple"> <option>Apple</option>

when I ran this javascript and tried to find the firstchild, got error message stating "undefined" However, I removed the space from the following line and that fixed it: 当我运行此javascript并尝试查找第一个孩子时,收到错误消息,指出“未定义”。但是,我从以下行中删除了该空格并对其进行了修复:

<select id="mySelect" multiple="multiple"><option>Apple</option>

please notice how I removed the space between multiple and option 请注意我如何删除倍数和选项之间的空格

maybe 也许

var doc = document.getElementById("a'+ i +'");

without single quotes 没有单引号

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM