Jquery表单onchange选择值改变答案

【问题标题】：Jquery form onchange select values changingJquery表单onchange选择值改变
【发布时间】：2012-04-11 19:27:32
【问题描述】：

我正在寻找解决此问题的最佳方法。我有一个简单的商店逻辑问题。有 2 个选择元素，size 和 color。我想让它们依赖于数据（现在是示例数据，但稍后它将来自数据库） - 大小将决定客户可以看到哪些颜色选项（隐藏不必要的选项）。

第一个问题是，当我进行更改事件时，我想隐藏文档准备好的默认显示元素，它仍然可见（我必须再次将颜色更改为与打开下拉列表不同的颜色，然后它将不可见)。

第二个是我正在寻找最灵活的解决方案，因为我对我的有疑问。代码如下：

       var rozmiar = new Array("S", "M", "L", "XL", "XXL");
   var kolor = new Array("Czerwony", "Niebieski", "Zielony", "Biały", "Czarny");
   var opcje = new Array( rozmiar, kolor);

        $(document).ready(function(){
        $('.form1').change(function(){
                $('.form2 option').show();

                var selectSelector = function(z){
                    selectSelector = $('select.form2 option[value='+kolor[z]+']').hide();
                };

                wybranyRozmiar = $(this).val();
                    if(wybranyRozmiar == rozmiar[0]){
                        selectSelector(0);
                    }
                    if(wybranyRozmiar == rozmiar[1]){
                        selectSelector(1);
                    }
                    if(wybranyRozmiar == rozmiar[2]){
                        selectSelector(2);
                    }
                    if(wybranyRozmiar == rozmiar[3]){
                        selectSelector(3);
                    }
                    if(wybranyRozmiar == rozmiar[4]){
                        selectSelector(4);
                    }
            });
        });

【问题讨论】：

您介意分享您的一些代码吗？
刚做完，我也在考虑如何从我的选择器中制作变量，使其更短
@Malyo，请仅发布与问题相关的代码，而不是所有内容
@Malyo，我认为您需要分解您的问题并将其发布为不同的问题。
好的，我会尽量简化我的问题

标签： jquery forms select option onchange

【解决方案1】：

我只回答我理解的部分。

您可以使用 switch 来代替使用多个 if 语句

switch(selectsize) {
   case rozmiar[1]:
       $('select.form2 option[value='+color[2]+']').hide();
       break;
   //case <another>"
       //break;
}

【讨论】：

我正在考虑，但是switch真的更快吗？
@Malyo，请参考this。 ;)
我可以在 switch 中使用比较吗？像 case (wybranyRozmiar == rozmiar[0]) - 因为它对我的代码至关重要
@Malyo，我不建议这样做，因为从语义上讲这是错误的。 Switch 用于在一个表达式上处理多个版本的情况。

【解决方案2】：

这是我理解的需要做的事情。根据.form1中所选选项的索引，从.form2中选择对应的选项。

$('select.form1').change(function (i) {
  var selectedIndex = $('select.form1 option:selected').index();
  $('select.form2 option:eq(' + selectedIndex + ')').attr('selected', 'selected');
});

D3m0 : http://jsbin.com/azilow

【讨论】：