Question

我想弄清楚如何实现这个...我有三个下拉选择列表，每个列表都有自己的值。我想将三个选定值中的最小值/最小值放入隐藏/禁用的文本字段（以及<span>，以便它可以显示在列表下方。）

以下是我正在尝试使用的内容： -

<select name="Question1" id="Question1" onchange="code(1)">
<option value="10.00" >This is answer A1</option>
<option value="20.00" >This is answer A2</option>
<option value="30.00" >This is answer A3</option>
</select>

<select name="Question2" id="Question2" onchange="code(2)">
<option value="10.00" >This is answer B1</option>
<option value="20.00" >This is answer B2</option>
<option value="30.00" >This is answer B3</option>
</select>

<select name="Question3" id="Question3" onchange="code(3)">
<option value="10.00" >This is answer C1</option>
<option value="20.00" >This is answer C2</option>
<option value="30.00" >This is answer C3</option>
</select>

<input type="text" id="LowestValue" name="LowestValue" onfocus="this.blur()" />

<p>The lowest value is <span>//here should be the lowest of three values</span></p>

所以用户选择30.00,30.00和10.00如果有意义，结果应该是10.00？

<script>
    function code() { // forget the parameter
    var Value1 = document.getElementById('Question1');
    var Value2 = document.getElementById('Question2');
    var Value3 = document.getElementById('Question3');
    var LowestValue = document.getElementById('LowestValue');

//I realise this below is wrong but this is essentially what I'm hoping to acheive...
//var total = Math.min(Value1, Value2, Value3);

LowestValue.value = total;
}
</script>

值为十进制（双精度），因为这些值表示货币值（£10.00）

JSFiddle

感谢您的时间：）

Answer 1

此处更新的示例代码：http://jsfiddle.net/2qae6r52/5/

unwrapped the function declaration of code在小提琴中
LowestValueOutput id添加到span
使用.value元素select
使用3个参数Math.min
为最后一个输入添加disabled属性
使用.textContent获取span内容
使用.toFixed(2)制作一个包含2位小数的字符串（由Math.floor检查）

这里是HTML代码：

<select name="Question1" id="Question1" onchange="code(1)">
    <option value="10.00" >This is answer A1</option>
    <option value="20.00" >This is answer A2</option>
    <option value="30.00" >This is answer A3</option>
</select>

<select name="Question2" id="Question2" onchange="code(2)">
    <option value="10.00" >This is answer A1</option>
    <option value="20.00" >This is answer A2</option>
    <option value="30.00" >This is answer A3</option>
</select>

<select name="Question3" id="Question3" onchange="code(3)">
    <option value="10.00" >This is answer A1</option>
    <option value="20.00" >This is answer A2</option>
    <option value="30.00" >This is answer A3</option>
</select>

<input type="text" disabled="disabled" id="LowestValue" name="LowestValue" onfocus="this.blur()" />

<p>The lowest value is <span id="LowestValueOutput"><!--here should be the lowest of three values--></span></p>

这里是JS代码：

function code () { // forget the parameter
    var Value1 = document.getElementById('Question1');
    var Value2 = document.getElementById('Question2');
    var Value3 = document.getElementById('Question3');
    var LowestValue = document.getElementById('LowestValue');
    var LowestValueOutput = document.getElementById('LowestValueOutput');

    var total = Math.min(Value1.value, Value2.value, Value3.value);
    if (total != Math.floor(total)) {
         total = total.toFixed(2);
    }

    LowestValue.value = LowestValueOutput.textContent = total;
}

Answer 2

window.onload=function() {
  var sel1 = document.getElementById('Question1'),
      sel2 = document.getElementById('Question2'),
      sel3 = document.getElementById('Question3'),
      lowest =document.getElementById('LowestValue');
  sel1.onchange=
  sel2.onchange=
  sel3.onchange=function() {
    lowest.value=Math.min(
     parseFloat(sel1.value),
     parseFloat(sel2.value),
     parseFloat(sel3.value)).toFixed(2);
  }
}

来自多个下拉列表选择列表的最小值，如math.min

2 个答案: