Question

1）我没有Javascript知识。

2）我正在使用select2（多选）引导程序表单。 3）如果我点击相应组的一个选项，我想取消选择组的其他选项。

3.1）例如：如果选择了选项值“2”和“6”，然后单击选项“1”和“5”，它应自动取消选择选项“2”和“6”。

感谢。

          <div align = "center" class="form-group">
            <label>Filtros</label>
            <select name ="Filtros" id = "Filtros" class="form-control select2" multiple="multiple" data-placeholder="Selecione os Filtros"
                    style="width: 100%;">

            <optgroup label="IBC">
              <option value="1">IBC_ALL</option>
              <option value="2">IBC_SIM</option>
              <option value="3">IBC_NAO</option>
              <option value="4">IBC_Nao_Mostrar</option>

            <optgroup label="CROT">
              <option value="5">CROT_ALL</option>
              <option value="6">CROT_SIM</option>
              <option value="7">CROT_NAO</option>
              <option value="8">CROT_Nao_Mostrar</option>

            </select>
          </div>

Answer 1

它适用于我。如果您检查来自不同类别的多个选项，它会自动取消选择其他类别中的其他选项。
注意：当用户使用SHIFT键时不起作用。

<div align = "center" class="form-group">
<label>Filtros</label>
<select name ="Filtros" id = "Filtros" class="form-control select2" multiple="multiple" data-placeholder="Selecione os Filtros"
        style="width: 100%;">

<optgroup label="IBC" parent="1">
  <option value="1" childof="1">IBC_ALL</option>
  <option value="2" childof="1">IBC_SIM</option>
  <option value="3" childof="1">IBC_NAO</option>
  <option value="4" childof="1">IBC_Nao_Mostrar</option>

<optgroup label="CROT" parent="2">
  <option value="5" childof="2">CROT_ALL</option>
  <option value="6" childof="2">CROT_SIM</option>
  <option value="7" childof="2">CROT_NAO</option>
  <option value="8" childof="2">CROT_Nao_Mostrar</option>

</select>
</div>

<script>
var selected = {
    1:[],
    2:[]
}
var last_selected = 1;
document.getElementById('Filtros').addEventListener('click',function(e){
var parent = e.target.getAttribute('childof');

if( e.target.selected )
{
    selected[parent].push(e.target);

  for( var i=0; i < selected[parent].length; i++ )
  {
    var elem = selected[parent][i];

    if(!elem.selected)
      selected[parent].splice(i,1);
  }

  if( parent != last_selected )
  {
    for( var i=0; i < selected[last_selected].length; i++ )
    {
      var elem = selected[last_selected][i];
      elem.selected = false;
    }
  }

  last_selected = parent;
}
});
</script>

选择多个：如何选择/取消选择（Javascript）

1 个答案: