[英]How to get all selected values from different inputs - Javascript
I see a lot of questions like that but mine is different from theirs. 我看到了很多类似的问题,但我的问题与他们不同。 I have a form and the form includes 3 different select area for different variables.
我有一个表单,该表单包含3个用于不同变量的不同选择区域。 I want to get them but I don't know how to do and I'm newbie on Javascript and HTML.
我想得到它们,但我不知道该怎么做,而且我是Java和HTML的新手。
edit: I deleted the " sending database " part. 编辑:我删除了“发送数据库”部分。 It was part of the context.
这是上下文的一部分。
Here is HTML: 这是HTML:
<form>
<p> Scores: </p>
<select name ="scores:">
<option value= " 9 " name= " 9 "> 9 </option>
<option value= " 8 " name= " 8 "> 8 </option>
<option value= " 7 " name= " 7 "> 7 </option>
<option value= " 6 " name= " 6 "> 6 </option>
<option value= " 5 " name= " 5 "> 5 </option>
<option value= " 4 " name= " 4 "> 4 </option>
<option value= " 3 " name= " 3 "> 3 </option>
<option value= " 2 " name= " 2 "> 2 </option>
<option value= " 1 " name= " 1 "> 1 </option>
</select>
<p> Years: </p>
<select id ="year">
</select>
<p> Languages: </p>
<select name="language">
<option value ="Aborginial", name = "Aborginial"> Aborginial </option>
<option value="Arabic"> Arabic </option>
<option value="Aramaic">Aramaic</option>
<option value="Bosnian">Bosnian</option>
<option value="Cantonese">Cantonese</option>
<option value="Chinese">Chinese</option>
<option value="Czech">Czech</option>
</select>
<button type="button">Submit data</button>
</form>
Assuming user selected score 7, set the language to Bosnian and the year is 1980 ( I'm populating the year box with a function don't worry it is not empty list ) and I want to get these selected values (score: 7, lang: Bosnian, year:1980) By the way all of them are in the form. 假设用户选择分数7,将语言设置为波斯尼亚语,年份为1980(我在函数中填充年份框,不用担心它不是空列表),我想获取这些选择的值(得分:7) lang:Bosnian,year:1980)顺便说一句,它们都是形式。 So how can I get these selected values?
那么如何获得这些选定的值?
You have the following mistakes in your HTML: 您的HTML中存在以下错误:
<option>
tag attributes if your value equal to your option's name. <option>
标记属性。 So in this code: 所以在这段代码中:
<select name="scores">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select>
You can access "scores" value as: 您可以按以下方式访问“得分”值:
var select_scores = document.getElementById("form").scores;
select_scores.options[select_scores.selectedIndex].value;
Same for other form <select>
elements. 其他形式的
<select>
元素相同。
Return an object : 返回一个对象:
document.getElementById("submit").addEventListener("click", getData); function getData() { var score = document.getElementById('scores').value; var year = document.getElementById('year').value; var language = document.getElementById('language').value; var data = {'score':score, 'year':year, 'lang':language}; console.log(data); }
<form> <p> Scores: </p> <select id ="scores" name ="scores:"> <option value= " 9 " name= " 9 "> 9 </option> <option value= " 8 " name= " 8 "> 8 </option> <option value= " 7 " name= " 7 "> 7 </option> <option value= " 6 " name= " 6 "> 6 </option> <option value= " 5 " name= " 5 "> 5 </option> <option value= " 4 " name= " 4 "> 4 </option> <option value= " 3 " name= " 3 "> 3 </option> <option value= " 2 " name= " 2 "> 2 </option> <option value= " 1 " name= " 1 "> 1 </option> </select> <p> Years: </p> <select id ="year"> </select> <p> Languages: </p> <select id= "language" name="language"> <option value ="Aborginial", name = "Aborginial"> Aborginial </option> <option value="Arabic"> Arabic </option> <option value="Aramaic">Aramaic</option> <option value="Bosnian">Bosnian</option> <option value="Cantonese">Cantonese</option> <option value="Chinese">Chinese</option> <option value="Czech">Czech</option> </select> <button id="submit" type="button">Submit data</button> </form>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.