Как найти индекс максимального значения в HTML-таблице и использовать его для поиска другой информации в той же строке, но в другом столбце? - PullRequest
Новая
       22

Как найти индекс максимального значения в HTML-таблице и использовать его для поиска другой информации в той же строке, но в другом столбце?

0 голосов
/ 15 апреля 2019

В таблице HTML мне нужно получить максимальное значение столбца, а затем его положение, чтобы найти другую информацию в других столбцах в той же строке.В настоящее время я могу найти максимальное значение, но не его положение в столбце.

У меня есть классическая таблица и код, как показано ниже: 

<body>
<table id="tableau">
<thead>
                <tr>
                    <th>#</th>
                    <th>Firstname</th>
                    <th>Lastname</th>
                    <th>City</th>
                    <th>Score</th>
                </tr>
            </thead>
            <tbody>
               <tr>
                    <td>1</td>
                    <td>José</td>
                    <td>Maire</td>
                    <td>Paris</td>
                    <td>1000</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>Lilianne</td>
                    <td>Maire</td>
                    <td>Paris</td>
                    <td>1234</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>Raymond</td>
                    <td>Fourbe</td>
                    <td>Bruxelles</td>
                    <td>123</td>
                </tr>
                <tr>
                    <td>4</td>
                    <td>Huguette</td>
                    <td>Fourbe</td>
                    <td>Bruxelles</td>
                    <td>129099</td>
                </tr>
</tbody>
</table>
 <button type="buttonmax" id="Score maximum" class="btn btn-info">Afficher le Score maximum</button>

<script>
var myArray = new Array();
            $(document).ready(function() 
            {
                $("#tableau tr td:nth-child(5)").each(function(i){
                    myArray.push($(this).text());
                });

            document.getElementById("Score maximum").onclick = function(){
             var max = Math.max.apply(Math, $('td:nth-child(5)').map(function(i,elem){ 
                return Number($(elem).text());
             }));

             alert(max);}
             });
</script>
</body>

На мой взгляд, я должен найтииндекс максимального значения для отображения Firstname и Lastname человека, который понял это значение, находящегося в той же строке, но в других столбцах.

Как вы думаете, это лучший способ сделать это?

Я пробовал разные коды, чтобы получить индекс max, но ни один из них не работал.

Не могли бы вы помочь мне получить индекс и найти человека, который набрал лучший результат?

1 Ответ

0 голосов
/ 16 апреля 2019

Это был бы способ достичь этого (хотя он не очень производительный, потому что он перезаписал бы весь объект, если текущее проверенное значение выше, чем предыдущее).ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ: я изменил ваш идентификатор на "Scoremaximum", потому что вы действительно не должны иметь пробелов в селекторе идентификаторов. 

var max = {
    score: 0,
    id: 0,
    firstname: '',
    lastname: '',
    city: ''
};

$("#tableau tr td:nth-child(5)").each(function(index, elem) {
    var current = parseFloat($(elem).text());
    if(current > max.score) {
        max.score = current;
        max.id = $("#tableau tr td:nth-child(1)")[index].textContent;
        max.firstname = $("#tableau tr td:nth-child(2)")[index].textContent;
        max.lastname = $("#tableau tr td:nth-child(3)")[index].textContent;
        max.city = $("#tableau tr td:nth-child(4)")[index].textContent;
    }
});

$('#scoremaximum').on('click', function() {
  alert("score: " + max.score + ", id: " + max.id + ", firstname: " + max.firstname + ", lastname " + max.lastname + ", city: " + max.city);
});

Вы могли бы немного увеличить производительность, если бы вы добавили другое свойство к объектуон отслеживает индекс вне цикла и обновляет его в соответствии с max.score.Затем вы можете запустить функцию обратного вызова после завершения цикла и передать ей max.index.Это будет выглядеть так: 

var max = {
    score: 0,
    index: 0,
    id: 0,
    firstname: '',
    lastname: '',
    city: ''
};

$("#tableau tr td:nth-child(5)").each(function(index, elem) {
    var current = parseFloat($(elem).text());
    if(current > max.score) {
        max.score = current;
        max.index = index;
  }
  return callback(max.index);
});

function callback(index) {
    max.id = $("#tableau tr td:nth-child(1)")[index].textContent;
    max.firstname = $("#tableau tr td:nth-child(2)")[index].textContent;
    max.lastname = $("#tableau tr td:nth-child(3)")[index].textContent;
    max.city = $("#tableau tr td:nth-child(4)")[index].textContent;
}

$('#scoremaximum').on('click', function() {
  alert("score: " + max.score + ", id: " + max.id + ", firstname: " + max.firstname + ", lastname " + max.lastname + ", city: " + max.city);
});

Codepen: https://codepen.io/anon/pen/KYyyKV

...