Блог

После того, как я нажал на ссылку, которая переходит на другую страницу, я должен прокрутить первое (самое раннее) появление тревоги (которое помечено красным текстом) в верхней части «tbody» div. В каждой строке есть id='tab_content' и данные таблицы class = 'td_list_row_center' . При возникновении тревоги tds меняют цвет с черного на красный и имя class = 'td_list_row_center font-red" .

Я пытался обработать появление красного цвета, и если оно было найдено, прокрутите вверху внутри «tbody» div. Вторая строка должна быть черным шрифтом (без тревоги)

 <script>
    function scrollToFirstRedAlarmOccurence(red_occurrence) {
        $('tbody').animate({
            scrollTop: red_occurrence.offset().top
        }, 2000);
    }

    var red_occurrence = document.getElementsByClassName("td_list_row_center font-red");

    if(red_occurrence)
        scrollToFirstRedAlarmOccurence(red_occurrence);
    else
        null
</script>
  

После нажатия на ссылку и отображения таблицы ничего не происходит (например, скрипт не работает). Я ожидаю, что он будет прокручиваться до первого красного появления из огромного набора данных. После того, как я прокручиваю таблицу вверх, я увижу еще одно более позднее появление красного цвета. Ниже фактические и ожидаемые результаты в виде фотографий:

[Фактическое разрешение] -> https://ibb.co/1zn4ty9
[Ожидаемое разрешение] -> https://ibb.co/Jy6FrL6

Параметры для ‘getElementsByClassName’ неверны. Используйте их следующим образом.

 <script>
  function scrollToFirstRedAlarmOccurence(red_occurrence) {
    // make jQuery object for first element
    $('tbody').animate({
      scrollTop: $(red_occurrence[0]).offset().top,
    }, 2000);
  }
  setTimeout(() => {
    // select "font-red" classed elements
    var red_occurrence = document.getElementsByClassName("font-red"); // you can use jQuery selector too
    if(red_occurrence.length) { // check for array length
      scrollToFirstRedAlarmOccurence(red_occurrence);
    }
  }, 1000); // wait for DOM to render
</script>
  

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