jQuery选择具有相同选项的框,彼此依赖

时间:2017-05-23 07:37:36

标签: jquery select

例如: 我有3个选择框,每个选项值1-10。如果我在其中一个中选择值3,我需要其他人禁用8-10。

我尝试了这个,但它没有正常工作:

    Select 1: <select name="sel1">
  <option value="0">select</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<br>Select 2:
<select name="sel1">
  <option value="0">select</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<br>Select 3:
<select name="sel1">
  <option value="0">select</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
var oldval =0;
var newval =0;
var x=10;

jQuery('select[name^="sel"]').each(function() {
    var thisfahrt = jQuery(this).attr('name');

    jQuery(this).change(function() {
        var ges = 0;
        jQuery('select[name^="sel"]').each(function() {
            if(jQuery(this).val() > 0) {
                ges += parseInt(jQuery(this).val());
            }
        });
        maxval =  x-ges;

        jQuery('option').each(function() {
            if(jQuery(this).parent().val() > 0) {
                if(jQuery(this).val() > jQuery(this).parent().val()) {
                    jQuery(this).attr('disabled', true);
                } else {
                    jQuery(this).attr('disabled', false);
                }
            } else {                                                  
                if(jQuery(this).val() > maxval) {
                    jQuery(this).attr('disabled', true);
                } else {
                    jQuery(this).attr('disabled', false);
                }
            }
        });
    });

});

这是我的fiddle 也许有人有更好的工作解决方案吗?

谢谢

0 个答案:

没有答案