从一系列输入字段中获取最大值

Get max from series of input fields

本文关键字：获取 最大值 字段 一系列 输入      更新时间：2023-09-26

我有一系列输入字段。我不知道有多少，所以我需要从类中获取值。在本例中，类是.total。

bestresult是一个文本字段，从mysql获得它的值，但我希望它是手动更改或从其他文本字段的最高值。

这是代码。这显然不可行，但也许你知道我想做什么。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$('input.total').change(function()
{
    var max = $('.total').max();
    $('#bestresult').attr("value", max);
});
</script>
<body>
<form>
<input type="text" name="bestresult" id="bestresult" class="total" value=""><br>
<input type="text" name="resultat[100][total]" class="total" value=""><br>
<input type="text" name="resultat[121][total]" class="total" value=""><br>
<input type="text" name="resultat[130][total]" class="total" value="">
</form>
</body>
</html>

解决方案非常简单。试试这个:

$('input.total').change(function()
{
     var max = 0;
     $('.total').each(function(){
          if(parseFloat($(this).val()) > max ) {
               max = parseFloat($(this).val());
          }
     });
     $('#bestresult').val(max);
});

但是如果你有多个文本框，你应该跟踪最大值，并在每次触发更改事件时更新，以获得更好的性能。

    var max = 0;
    // get the max for the first time
    $(document).ready(function () {
        $('.total').each(function () {
            if (parseFloat($(this).val()) > max) {
                max = parseFloat($(this).val());
            }
        });
        $('#bestresult').val(max);
    });
    $('input.total').change(function () {
        if (parseFloat($(this).val()) > max) {
            max = parseFloat($(this).val());
        }
        $('#bestresult').val(max);
    });

首先，您应该将脚本放在正文的末尾，以便在绑定更改事件时定义元素。

然后，您最好过滤输入，以排除包含max的输入。您可以使用此选择器:input.total[id!=bestresult]。

最好也绑定keyup事件，这样最大值就会更新，而用户不必在外面点击。

因此，你可以有这样的代码: 
$('input.total[id!=bestresult]').on('blur change keyup', function(){
    $('#bestresult').attr("value", Math.max.apply(null, $('.total[id!=bestresult]').map(function(){
        return parseFloat(this.value)}).slice().filter(function(i, v){return v==v})
    ));
});
演示

相关文章：