在多选表单上，如果未选择任何选项，则在提交时选择所有选项答案

【问题标题】：On a multi-select form, on submit select all options if none were selected在多选表单上，如果未选择任何选项，则在提交时选择所有选项
【发布时间】：2015-08-07 06:28:50
【问题描述】：

使用 jQuery/Javascript，当用户单击提交时，我需要验证是否在选择表单上选择了至少一个选项，并且没有选择一个，我需要将它们全部提交。

所以在这样的表格上：

<form action="http://example.com" method="get" id="carfare" name="mycarform">
<select name="car" id="carchoice" multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<input id="carsubmit" type="submit">
</form>

如果用户在没有选择任何选项的情况下点击提交按钮，我需要它返回： http://example.com/?car=volvo&car=saab&car=opel&car=audi

【问题讨论】：

只是一个想法，或者您可以检查处理表单的 php 脚本中的 car 参数是否为空，如果是，则可以使用所有选项
为什么不默认选择所有选项，或者使用复选框？
我无法更改处理表单的脚本，所以我需要提交之前选择的数据。
而且，是的，我可以默认将它们全部选中，但这需要与想要进行特定选择的用户进行更多交互：他们必须取消全选，然后选择他们的选择（实际形式我正在使用有很多选择）。我更希望后备对最终用户几乎透明。

标签： javascript jquery forms multi-select

【解决方案1】：

首先，检查是否有通过doing选择的项目

if(!$('#carchoice').val())

然后，将它们全部设置为

$('#carchoice option').prop("selected", true);

$('form').submit(function(){
   if(!$('#carchoice').val()){
     $('#carchoice option').prop("selected", true);
     }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form action="http://example.com" method="get" id="carfare" name="mycarform">
<select name="car" id="carchoice" multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<input id="carsubmit" type="submit">
</form>

【讨论】：

【解决方案2】：

在提交时检查是否选择了选项，如果没有选择全部。

$(document).ready( function () {
    $('#carefare').submit( function () {
        var choice = $('#carchoice').val();
        if(!choice) {
            $('#carchoice option').attr('selected','selected');
        }
    });
});

转介jsfiddle 检查网络标签以获取提交的值

【讨论】：