如何通过jQuery禁用选择标签选项？需要帮助

我有一个关于选择标签选项的查询。任何人通过jQuery解决。假设我有两个选择标签，在第一个选择标签中我有语言和脚本选项，而在选择的第二个标签中我有关于语言&脚本的选项。问题是，如果我从第一个选择标记中选择语言，而不是只有语言选项应该在第二个标记中可见。像如何通过jQuery禁用选择标签选项？需要帮助

<select id="Languages"> 
    <option value="0">--Select--</option> 
    <option value="1">Languages</option> 
    <option value="2">Scripting</option> 
</select> 
<select id="Scripting"> 
    <option value="0">--Select--</option> 
    <option value="1">C#</option> 
    <option value="2">VB</option> 
    <option value="3">PHP</option> 
    <option value="4">jQuery</option> 
    <option value="5">javascript</option> 
</select>

现在，如果我选择语言选项只有C＃，VB & PHP应该是可见的，所有其他选项都将禁用。

来源

2010-08-10 Bonvoyager

你可以对此做两点认可。

对选择的元素在id的开头的字符串，即：

<选择ID = “first_select”> <选项ID = “郎”>郎 <选项ID = “脚本>脚本 < /选择>

<选择ID =” second_select “> <选项ID =” lang_1" >郎1 < option id =“script_1”脚本1 </select>

第一次选择绑定on change事件。

$('#first_select').change(function() { 
    var type = $(this).attr('id'); 
    $('#second_select option').hide() // Hide all to just show the ones matching type 
    $('#second_select option[id^=' + type + ']').show() 
});

二：几乎相同，但相反，您使用1选择为第一个选择元素中的每个类型。并在变化哈德，并显示适当的。

..fredrik

来源

2010-08-10 12:45:42 fredrik

显示和隐藏''

这里有一个基本的模板，使得它比较容易配置：

var languagePairings = { 
    language1: ['languageA', 'languageB'], 
    language2: ['languageC', 'languageD'] 
}; 

$(function() { 
    $('#select1').change(function() { 
     var $select2 = $('#select2'), 
      val = $(this).val(), 
      availableLanguages = languagePairings[val]; 
     if (availableLanguages && availableLanguages.length) { 
      for (var i = 0; i < availableLanguages.length; i++) { 
       var lang = availableLanguages[i]; 
       $select2.append($('<option />').attr('value', lang).text(lang)); 
      } 
     } else { 
      $select2.empty(); 
     } 
    }); 
});

来源

2010-08-10 12:47:43 jmar777

首先请查看文章的Selected from jquery。我想，你的代码会是这个样子：

<select name="select1" id="select1"> 
    <option class="script">Scripting</option> 
    <option class="language">Languages</option> 
</select> 

<select name="select2" id="select2"> 
    <option class="script">javascript</option> 
    <option class="language">C#</option> 
    <option class="script language">jQuery</option> 
</select> 

<script type="text/javascript"> 
    $("#select1").change(function() { 
    $("#select2 option").disabled = true; 
    $("#select1 option:selected").each(function() { 
     var classname = $("#select1").attr("class"); 
     $("#select2 ."+classname).disabled = false; 
    }); 
    }) 
    .trigger('change'); 
</script>

这是伪，现成的，顶级我的头的代码，你可能需要将其修改了一点，但总的想法是，你会为这些选项分配一个类并使用这些类的值来控制第二个表中可用的选项。

编辑：看起来像躲不上的选项工作，所以你可能会分别代替“残疾人= [布尔]”上面.show（）的调用或.hide（）。还检查了这个早期问题：

Hide options in a select list using jQuery

来源

2010-08-10 12:59:31 clumsyfingers

互斥选择：

<select name="st[]" prev_value=""> 
    <option value=""></option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 
<select name="st[]" prev_value=""> 
    <option value=""></option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 
<script> 
$("select[name='st[]']").live('change', function() 
             {if (this.value) 
              {$("select[name='st[]'] option[value='"+this.value+"']:not(:selected)").remove(); 
              } 
             if ($(this).attr('prev_value')) 
              {var prev_option=$(this).find("option[value='"+$(this).attr('prev_value')+"']"); 
              $("select[name='st[]']").not(this).append(prev_option.clone()); 
              } 
             $(this).attr('prev_value', this.value); 
             } 
          ); 
</script>

来源

2010-12-23 06:38:00 diyism

如何通过jQuery禁用选择标签选项？需要帮助

回答

相关问题