Question

我正在尝试构建一个用户＆＃34;兴趣点＃34;他们通过检查无线电盒指示。当我返回结果时，总会有一个＆＃34; undefined＆＃34;在一系列利益之前。我知道我可以通过将var interest初始化为空字符串来解决这个问题，如下所示：

var interests ="";

但我不确定这是否是解决问题的正确方法。是否有更优化的数据结构？

        var controlIndex;
        var element;
        var interests;
        var numberOfControls = document.form1.length;

       for (controlIndex = 0; controlIndex < numberOfControls; controlIndex++)

            {
                element = document.form1[controlIndex];
                if (element.type == "radio")
                {
                    if (element.checked == true)
                    {

                     interests += document.form1[controlIndex].value+"\n";


                     console.log(interests);
                     document.getElementById("interests").innerHTML= interests
                    }
                }
            }

        }


    }



<form action="" name="form1">
        <h1>Personal Details</h1>
        Please enter the following details:
        <br>
        <p>
        First Name:
        <br />
        <input type="text" name="txtName"  onchange="txtName_onchange()"/>
        </p>

        <p>
        Age:
        <br />
        <input type="text" name="txtAge" size="3" maxlength="3" onchange="textAge_onblur()" />
        </p>
        <p>
         My interest is:
        <p>Sports
        <input type="radio" name="sports"  value="sports"/>
        </p>
        <p>Politics
        <input type="radio" name="politics" value="politics" />
        </p>
        <p>Magazines
        <input type="radio" name="magazines" value="magazines">
        </p>
        <p>
        <input type="button" value="Submit Registration" name="btnCheckForm"  onclick="btnCheckForm_onclick()" >
        <input type = "button" value = "Clear Details" name="btnClear" onclick="btnClear_onclick()">
        </p>
    </form>
  </div>

Answer 1

我会转变你的兴趣＆＃34;变量为数组。

var interests = [];

然后我会像这样推进它。如果要打印出来，只需加入即可。

             interests.push(document.form1[controlIndex].value);

             console.log(interests.join(""));

Answer 2

但我不确定这是否是解决问题的正确方法......

是的，将变量初始化为字符串是解决此问题的正确方法。

基本上，无论何时初始化变量都是这样的：

var interests;

变量类型隐式设置为undefined，因此当您对其应用+=时，JavaScript会将类型更改为字符串，其值为"undefined"。设置初始值可以防止：

var interests = '';

Answer 3

我试图将上述答案中提到的相同内容放在代码段中以便更好地理解。在我看来阵列适合这里

function btnCheckForm_onclick (){ 
var controlIndex;
        var element;
        //Case with '' intitlization
        var interests = '';
        
        //Case with [] intitlization
        var interests = [];
        
       var numberOfControls = document.form1.length;

       for (controlIndex = 1; controlIndex < numberOfControls; controlIndex++)

            {
                element = document.form1[controlIndex];
                if (element.type == "radio")
                {
                    if (element.checked == true)
                    {
                     // Case with []
                     //interests.push(document.form1[controlIndex].value);
                     //console.log(interests.join(" "));
                    
                     //Case with ''  
                     interests += document.form1[controlIndex].value+"\n";
                     console.log(interests);
                     
                    }
                }
            }
  
  document.getElementById("interests").innerHTML= interests

}

<form action="" name="form1">
        <h1>Personal Details</h1>
        Please enter the following details:
        <br>
        <p>
        First Name:
        <br />
        <input type="text" name="txtName"  onchange="txtName_onchange()"/>
        </p>

        <p>
        Age:
        <br />
        <input type="text" name="txtAge" size="3" maxlength="3" onchange="textAge_onblur()" />
        </p>
        <p>
         My interest is:
        <p>Sports
        <input type="radio" name="sports"  value="sports"/>
        </p>
        <p>Politics
        <input type="radio" name="politics" value="politics" />
        </p>
        <p>Magazines
        <input type="radio" name="magazines" value="magazines">
        </p>
         
        <p>
        <input type="button" value="Submit Registration" name="btnCheckForm"  onclick="btnCheckForm_onclick()" >
        <input type = "button" value = "Clear Details" name="btnClear" onclick="btnClear_onclick()">
        </p>
  
  <div id="interests"></div>

javascript变量返回null

3 个答案: