如果在其他<select>中选择,则禁用jQuery <select>选项

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (64)

如果选项在任何选择中被选中,则尝试禁用该选项。

因此,例如,如果name=“select 1”选择了选项“Test 2”,那么我希望在两个SELECT语句中禁用“Test 2”...如果检查了其他内容,则重新启用前面的选项。

我在这里写了一个示例脚本:

<script type="text/javascript">
$(document).ready(function(){
 $("select").change(function() {
  $("select").find("option:selected").attr('disabled', true);
 });
});
</script>

<select name="select1">
    <option>No Match</option>
    <option value="1">Test</option>
    <option value="2">Test 2</option>
    <option value="3">Test 3</option>
</select>

<select name="select2">
    <option>No Match</option>
    <option value="1">Test</option>
    <option value="2">Test 2</option>
    <option value="3">Test 3</option>
</select>
提问于
用户回答回答于
$('select').change(function() {

    var value = $(this).val();

    $(this).siblings('select').children('option').each(function() {
        if ( $(this).val() === value ) {
            $(this).attr('disabled', true).siblings().removeAttr('disabled');   
        }
    });

});

你可能更喜欢这个版本的代码:

$('select').change(function() {

    $(this)
        .siblings('select')
        .children('option[value=' + this.value + ']')
        .attr('disabled', true)
        .siblings().removeAttr('disabled');

});

请注意,第二个版本是一行(一行代码),但我格式化它是为了提高可读性。我更喜欢第二个版本。

在最坏的情况下--当选择框在DOM树中相距很远且遍历效率不高时,你只需将ID属性分配给它们,并使用以下代码来选择另一个框:

$('#select1, #select2').not(this)

热门问答

关于web表情包集成?

最爱开车啦互联网的敏感者
推荐
表情使用方式有两种方式: 1)是使用 TIMFaceElem 中的 index,标识表情的索引,比如 Android 和 iOS 两端都有同一套表情图,索引2为笑脸,index=2 就表示笑脸,两端发送和接收都显示同一张索引表情图片即可。 2 ) 是使用 TIMFaceElem ...... 展开详请

如何将本地的.json格式的文件部署到服务器上, 通过url请求?

使用 CDS-Mask 做数据合作,怎么确保双方都不能反推对方的 ID?

用户2134289

腾讯科技 · 高级工程师 (已认证)

推荐
您好,两种方案可以解决您的需求 1)如果您这边ID不需要在业务上使用,将ID进行加星脱敏即可,加星后的所有数据字符将变为*,无法还原; 2)如果您这边ID在业务上需要使用,也就是ID在处理后必须保持唯一性,那么需要采用腾讯数港算法解决该问题,数港算法目前灰度中,如需要申请,烦请通...... 展开详请

如何调整版本库大小?

marssun_1984

腾讯 · 高级产品经理 (已认证)

腾讯研发管理部产品经理
推荐

cos.sliceUploadFile支持断点续传吗?

如果用的是 cos-js-sdk,那么 cos.restartTask 是会断点续传的,用法没有问题。 PS: sdk 使用可以参考 demo.js https://github.com/tencentyun/cos-js-sdk-v5/blob/master/demo/demo...... 展开详请

MySQL还要另外购买吗?

蒋小爱

腾讯云 · 技术支持 (已认证)

推荐已采纳
您好,您可在服务器中自建MySQL ,同时腾讯云提供数据库 MySQL(TencentDB for MySQL)让用户可以轻松在云端部署、使用 MySQL 数据库。MySQL 是世界上最流行的开源关系数据库,通过云数据库 MySQL,您在几分钟内即可部署可扩展的 MySQL ...... 展开详请

所属标签

扫码关注云+社区

领取腾讯云代金券