2个框，2个动态最大值在设置一个时发生变化 - 2 boxes, 2 dynamic maximums changing when one is set

2 boxes, 2 dynamic maximums changing when one is set

我有一段代码，它为两个文本框设置动态最大值：

var length = document.getElementById('firstBox'),
    width = document.getElementById('secondBox');
    max1 = 100;
    min1 = 20;
    max2 = 200;
    min2 = 10;
length.onchange = function() {
    var maxValue, minValue;
    if (width.value < max1) {
        maxValue = max2;
        minValue = (width.value < min1) ? min1 : min2;
    } else {
        maxValue = max1;
        minValue = min1;
    }
    if (this.value > maxValue) {
        this.value = maxValue;
    }
    if (this.value < minValue) {
        this.value = minValue;
    }
};
width.onchange = function() {
    var maxValue, minValue;
    if (length.value < max1) {
        maxValue = max2;
        minValue = (length.value < min1) ? min1 : min2;
    } else {
        maxValue = max1;
        minValue = min1;
    }
    if (this.value > maxValue) {
        this.value = maxValue;
    }
    if (this.value < minValue) {
        this.value = minValue;
    }
};

它工作得很好，只是如果客户在另一个框中键入的值高于最低最大值（max1），我希望将最大值（max2）切换到该框。

假设一个客户在第一个框中键入"150"，那么该框会自动分配给max2"200"-但我想要的是，如果客户在第二个框中也键入"150"或任何高于max1的值，那么它应该变成max2，这意味着第一个框将从"150"降低到"100"，就像max1一样。反之亦然。

希望这是可以理解的，否则请告诉我，我会尽力解释得更好。

这个想法不是保存变量firstbox和secondbox，而是保存指向符合max1max1box的框和符合max2max2box的框的指针变量。

在逻辑指示切换最大值的情况下，只需切换指针即可。

var max1box = document.getElementById('length'),
    max2box = document.getElementById('width');
    max1 = 100;
    min1 = 20;
    max2 = 200;
    min2 = 10;
max1box.addEventListener('change',validateValues);
max2box.addEventListener('change',validateValues);
function validateValues() {
    if (this == max1box && this.value > max1 && this.value > max2box.value)
    {
       max1box = max2box; 
       max2box = this;  
    } 
    if (max1box .value > max1) {
        max1box .value = max1;
    }
    if (max1box .value < min1) {
        max1box .value = min1;
    }        
    if (max2box.value > max2) {
        max2box.value = max2;
    }
    if (max2box.value < min2) {
        max2box.value = min2;
    }
   }

你可以在这里看到它的作用：http://jsfiddle.net/Hm2Qn/1/

切换的规则可能不是你所需要的，但你可以从这里开始。