javascript - 是否可以使用 jQuery 获取最小值和最大值并将其呈现在另一个输入字段中？

Question

我们开始了:

我正在编写(实际上感觉更像是尝试和询问)一个使用 JS 并包括(也使用)jQuery 库的 GreaseMonkey 脚本。

我创建了另一个包含一些输入字段的表格。示例(仅输入字段):

  + "   < input type=\" text\"  id=\" field_1\"  name=\" min_field_1\" value=\"\" > " 
  + "   < input type=\" text\"  id=\" field_2\"  name=\" min_field_2\" value=\"\" > " 
  + "   < input type=\" text\"  id=\" field_3\"  name=\" min_field_3\" value=\"\" > " 
  + "   < input type=\" text\"  id=\" field_4\"  name=\" min_field_4\" value=\"\" > "<p></p>

<p>//the results should be rendered in another input-field in this case with id=field_result_min
  + "   < input type=\" text\" id=\" field_result_min\"  name=\"min_field_result\" > " 
  + "   < input type=\" text\"  id=\" field_result_max\"  name=\"max_field_result\" > " 
  + "   < input type=\" text\"  id=\" field_result_avg\"  name=\"avg_field_result\" > " 
</p>

我的目标是获取字段的最小值、最大值和平均值，并将结果呈现在另一个输入字段中。

//returns the min value of all input-fields starting with a name attribute of min
$("input[name^='min']")min.()

这行不通，因为 jQuery 库没有像 JS 那样的任何 min() 或 max()。

所以我尝试了某事。喜欢

<input type="button" value="=" onclick="window.document.getElementById('field_result_min') = Math.min(window.document.getElementById('field_1').value,window.document.getElementById('field_2').value,window.document.getElementById('field_3').value,window.document.getElementById('field_4').value)" > 

嗯...我又一次陷入困境和困惑 - 即使在我解释的时候也是如此。

问题:如何在一个输入字段中渲染多个输入字段的最小值和最大值？

任何帮助将不胜感激。失败

更新我就是这样解决的。好吧，它只是 avg 和 max(min 是可导出的)。任何更改或错误都应该来自复制粘贴和更改某事。在 stackoverflow 的代码中。

function calculateAvg() {<p></p>

<p>var fields = [1*window.document.getElementById('field_1').value,1*window.document.getElementById('field2').value,1*window.document.getElementById('field').value,1*window.document.getElementById('field4').value,1*window.document.getElementById('field5').value,1*window.document.getElementById('field6').value];</p>

<p>var total = 0;
var anzahl = 0;
    for(i=0;i 0) {
    total = total+fields[i];
    anzahl=anzahl+1;}
}
var durchschnitt = (total/anzahl);
window.document.getElementById('fieldavg').value = durchschnitt;
}
 $("#fieldavg").blur  (calculateAvg);</p>

<p>function calculateMax() {</p>

<p>var fields = [1*window.document.getElementById('field_1').value,1*window.document.getElementById('field2').value,1*window.document.getElementById('field').value,1*window.document.getElementById('field4').value,1*window.document.getElementById('field5').value,1*window.document.getElementById('field6').value];</p>

<p>var max = 0;
for(i=0; i<fields.length;i++) {
      if(fields[i] > 0) {
if(max<fields[i]){
max=fields[i];
}
}
}
window.document.getElementById('field8').value = max;</p>

<p>}</p>

<p>$("'field_8").blur  (calculateMax);</p>

<p></p>

那么，谢谢你的帮助。我真的需要它。失败

Answer 1

使用其他库是一种方法，但手动解决小问题 [使用原始 javascript] 会更好。更改下面代码中的选择器，并检查。

$(function(){
    sel = $('.field')
    min_field = $('#min');
    max_field = $('#max');
    avg_field = $('#avg');
    len = $(sel).length;
    $(sel).change(function(){
       sum = 0
       list = []
       $(sel).each(function(){
            val = Number($(this).val());
            list.push(val);
            sum += val;
        })
        $(min_field).val(Math.min.apply(Math, list))
        $(max_field).val(Math.max.apply(Math, list))
        $(avg_field).val(sum/len);
     })
})

快乐编码。