Как узнать индекс опции, ближайшей к верхней границе select в сообщении alert при прокрутке select?
<!DOCTYPE html> <html lang="ru"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body onload="OnLoad()"> <select></select> <script> function OnLoad() { for (var i = 0; i < 100; i++) { var VarOpt = document.createElement("option"); VarOpt.text = i; document.querySelector("select").appendChild(VarOpt); } } </script> </body> </html> |
<!DOCTYPE html> <html lang="ru"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body onload="OnLoad()"> <select></select> <script> function OnLoad() { for (var i = 0; i < 100; i++) { var VarOpt = document.createElement("option"); VarOpt.text = i; document.querySelector("select").appendChild(VarOpt); } } </script> </body> </html>
Дополнительно:
написать кастомный селект.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы узнать индекс опции, ближайшей к верхней границе select в сообщении alert при прокрутке select, можно воспользоваться следующим кодом на JavaScript:
document.getElementById('mySelect').addEventListener('scroll', function() { var select = document.getElementById('mySelect'); var index = Math.round(select.scrollTop / select.firstElementChild.clientHeight); alert('Индекс опции: ' + index); });
В данном коде мы добавляем слушатель события scroll к элементу select с id 'mySelect'. При каждом прокручивании select вызывается функция, которая определяет индекс опции, ближайшей к верхней границе select, и выводит его в сообщении alert.
В переменной index мы используем формулу Math.round(select.scrollTop / select.firstElementChild.clientHeight), чтобы вычислить индекс опции. Здесь select.scrollTop представляет собой количество пикселей, на которое был прокручен select, а select.firstElementChild.clientHeight - высоту первой опции в списке.
Таким образом, при прокрутке select будет выводиться сообщение alert с индексом опции, ближайшей к верхней границе select. Надеюсь, это поможет в решении вашей проблемы!