这是我的 HTML
<form action="processForm.html" method="post">
<label for="InputOne">Input One</label>
<select id="InputOne">
<option val="1">Item</option>
<option val="2">Item</option>
<option val="3">Item</option>
<option val="4">Item</option>
</select>
<label for="InputTwo">Input Two</label>
<select id="InputTwo">
<option val="1">Item</option>
<option val="2">Item</option>
<option val="3">Item</option>
<option val="4">Item</option>
</select>
<input type="submit" value="Submit">
</form>
如何让用户从多个下拉列表中进行选择,然后点击提交按钮?我找到了这个答案 How to submit form on change of dropdown list? .它很接近,但我认为这不是我想要的。这将在单个下拉列表之后提交。
最佳答案
简短的回答
<form id="my-form" method="post">
<select name="first-list" multiple="multiple" size="10">
<option value="0"></option>
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
</select>
<select name="second-list" multiple="multiple" size="10">
<option value="0"></option>
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
</select>
<!-- use this for client-side processing -->
<input type="button" name="button" value="submit" />
<!-- use this for server-side processing -->
<input type="submit" name="submit" value="submit" />
</form>
编辑
//
// Collecting selected items from one or more multiple select-lists
//
window.onload = function(){
document.getElementById("button").onclick = function(){
var lists = document.getElementsByTagName('SELECT'), chosen = [], temp = [], list = {}, i, j;
for(i = 0; i < lists.length; i++) {
list = lists[i];
temp = [];
for(j = 0; j < list.length; j++) {
if(list[j].selected) temp.push(list[j].value);
}
chosen.push(temp);
}
console.log(JSON.stringify(chosen));
// you will have JSON like this [["1","4","5"],["6","7"]]
};
现在,您已准备好要在服务器上发送的 JSON 对象。如果您对如何操作有任何疑问,请查看我之前关于主题 how to send and receive JSON data with JavaScript using POST and GET method. 的回答。
并检查工作fiddle .
关于javascript - 从多个下拉列表中选择项目后提交表单 - JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24531815/