从多选(multiple)的select中得到所选结果

最新推荐文章于 2021-06-02 15:32:59 发布

最新推荐文章于 2021-06-02 15:32:59 发布 · 391 阅读

文章标签：

#javascript #ViewUI

本文介绍了解决多选下拉框提交时只能接收到最后一个选项的问题。提供了两种有效的方法：一是通过JavaScript处理，二是利用数组形式提交。两种方法均可确保所选多个选项正确传递。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<select name="classid" multiple>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
类似代码，选中几个后，提交，处理页只能接收到你选择的最后一个选项：（

我整理了两种方法。
第一种方法：js处理

<script type="text/javascript">
function checkform(oThis)
{
var oData = oThis.classid.options;
for(var i=0;i<oData.length;i++){
if(oData[i].selected) oThis.arrclass.value += oData[i].value + ",";
}
alert(oThis.arrclass.value);
return true;
}
</script>

<form action="?action=saveedit" method="post" onsubmit="checkform(this)">
<select name="classid" multiple>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<input type="hidden" name="arrclass" value="">
</form>

加了一个隐藏的字段，用于接收多选的实现value值，然后提交。
比如选中3,5,6选项，点提交后，弹出3,5,6，表示提交过去的数据是正确的。

第二种方法：用数组
方法较简单，只是需要在接收页面做些处理。
把select那句改成：<select name="classid[]" multiple>即可。
选中3,5,6选项，此时接收页面
print_r($_POST['classid']);
echo implode(",",$_POST['arrclass']);
分别输出：
Array ( [0] => 3 [1] => 5 [2] => 6 )
和
3,5,6

呵呵，成功！