Question

所以我创建了一个from，我想在用户按下提交按钮时显示用户选择的选项以显示在有序列表中。我已经尝试了我能找到的所有内容以及我得到的所有三个变量的结果＆＃34; info＆＃34;未定义。如果你能帮助我，我会很高兴谢谢你。

以下是为表格编写的代码。

<form id="music">
                    <div id="m"> 
                    <p>What is your favourite genre of music?</p>
            <input type="radio" name="genre" value="Pop" id="Pop" checked> <label for ="Pop"> Pop </label>
            <input type="radio" name="genre" id="Rock" > <label for ="Rock"> Rock </label>
            <input type="radio" name="genre" id="Classical"> <label for ="Classical"> Classical </label>
            <input type="radio" name="genre" id="Rap/HipHop" > <label for ="Rap/HipHop"> Rap/HipHop </label>
            <input type="radio" name="genre" id="Electronic" > <label for ="Electronic"> Electronic </label>
            <input type="radio" name="genre" id="Country" > <label for ="Country"> Country </label>
            <input type="radio" name="genre" id="Other" > <label for ="Other"> Other </label>
            <input type="radio" name="genre" id="don't listen to music" > <label for ="don't listen to music"> I don't listen to music! (WUT??) </label>
            </div> 
            </br>
            </br>
            How do you usually commute to UVic?
            <div id="t">
            <form id="trans">
            <select name="commute">
                    <option value="Bus"> Bus </option>
                    <option value="Drive"> Drive </option>
                    <option value="Bike"> Bike </option>
                    <option value="Walk"> Walk </option>
                    <option value="Crawl"> Crawl -__- </option>
                    <option value="Fly"> Fly?!! </option>
            </select>
            </div>
            </br>
            <div id="p">
            <form id="pasta">
            What is your favourite type of sauce on pasta?
            <input type="text" name="sauce" value="Sauce boss"> 
            </div>
            </br>
            <button type="button" onclick="result()"> Submit </button>
            <button type="reset" value="Reset">Reset</button>
    <ol id="myResult"> &nbsp; </ol>

以下是为函数＆＃34; result（）＆＃34;编写的javascript，假设在按下提交按钮时起作用。

function result() { 
        var info = new Array();

info[0] = document.getElementById("m").value;


info[1] = document.getElementById("t").value;


info[2] = document.getElementById("p").value;

info.sort();

var mySubmit = document.getElementById("myResult");

var y = " ";

for (var i=0; i<info.length; i++)

 {
  var x = info[i];

    y = y + "<ol>" + x + "</ol>";
 }

 mySubmit.innerHTML = y;

}

Answer 1

事实上，您的代码存在一些问题。我已经纠正了一些问题，jsfiddle正如你所希望的那样工作。

你不应该得到div的值，div元素有 NOT 值属性。这是您的代码的主要问题。此外，您不必将表单分开，所有输入都可以包含在一个表单中。

此外，我添加了JQuery以使工作更轻松，例如，获取单选按钮的值：
info[0] = $('input[name="genre"]:checked').val();

Answer 2

我不会为你解决这个问题，因为你根本就不会为自己学习，所以这就是问题所在：

无需多种表格
你没有关闭任何表格（不是你需要不止一个），虽然这不是错误的原因。
在你的javascript中，你试图获得分裂的价值。 <div>不是表单字段/元素，因此它没有值。因此undefined就是结果。

我的建议，检查HTML表单的一些基本教程并正确理解它们。查看一些例子。否则，除了你试图从没有任何值的元素中获取数据值之外，你的javascript几乎都有了正确的想法。

我希望帮助

从不同类型的表单中获取结果

2 个答案: