SumoSelect 取消选择其他选项

Posted

技术标签:

【中文标题】SumoSelect 取消选择其他选项【英文标题】:SumoSelect Unselect the other option 【发布时间】:2020-05-06 06:39:58 【问题描述】:

当我选择值为 0 的选项时,我想取消选择所有其他选项。另一方面,当我选择非 0 的其他值时,我需要取消选择值为 0 的选项。请帮助我,以下是我的代码。

<script type="text/javascript">
    $(document).ready(function() 
       $('.sumomultiple').SumoSelect();
       $('.sumomultiple')[0].sumo.selectItem("0");
   );
</script>

<select id="st_type" class="sumomultiple table-group-action-input form-control" multiple="multiple" placeholder="Unselect All" onchange="$('#s_transtype').val($(this).val())">
    <option value="0">Unselect All</option>
    <option value="23">A</option>
    <option value="24">B</option>
    <option value="25">C</option>
</select>

$('#st_type').change(function()

 // Please Help Here

);

我已经尝试了很多方法,但我仍然不知道该怎么做,请帮助我。非常感谢...

【问题讨论】:

【参考方案1】:

该行为是 SumoSelect 内置的,无需自己编写。使用设置中的selectAll 选项来启用它:

jQuery(function() 
  $('.sumomultiple').on('change', function() 
    $('#s_transtype').val($(this).val())
  ).SumoSelect(
    selectAll: true
  );
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.0.2/jquery.sumoselect.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.0.2/sumoselect.min.css" />
<select id="st_type" class="sumomultiple table-group-action-input form-control" multiple="multiple" placeholder="Unselect All">
  <option value="23">A</option>
  <option value="24">B</option>
  <option value="25">C</option>
</select>

<input type="text" readonly="true" id="s_transtype" />

我建议阅读库 documentation 并查看 examples 以了解有关可用功能的更多信息。

【讨论】:

是的,我知道全选功能,但我提到的是当我选择第一个值为 0 时,另一个选项将取消选择,如果它被选中或保持未选中,但是当另一个不为0的选项被选中,第一个为0的值如果被选中则取消选中。 没错。删除 0 值选项。这就是select all的重点

以上是关于SumoSelect 取消选择其他选项的主要内容,如果未能解决你的问题,请参考以下文章

替换 SumoSelect 库中的选择选项

Sumoselect 中的选项可以添加图标/图像吗?

SumoSelect 不显示复选框或允许(多个或单个)选择

在引导模式中显示 sumoselect

SumoSelect 处理事件不适用于 Android 设备

选择所有垫子选项并取消选择全部