Javascript: программно прокручивать не всплывающий элемент SELECT в нижней части Chrome
у меня естьSELECT элемент на веб-странице, и я бы хотел, чтобы он загружался с прокруткой вниз. В большинстве браузеров я могу сделать это:
myselect.scrollTop = myselect.scrollHeight;
Несмотря на то чтоscrollHeight за пределами этого, браузеры понимают это и ограничивают его соответствующим образом. За исключением в Google Chrome. Я мог бы подать отчет об ошибке, но это не помогло мне решить мою непосредственную проблему. Итак, я попробовал это:
myselect.scrollTop = myselect.scrollHeight - myselect.clientHeight;
Но это слишком много вычитало - под элементом находились предметы. Я также пытался вычестьoffsetHeight, но это было немного хуже.
Кто-нибудь знает независимый от браузера способ правильно рассчитатьscrollTop это правильно, так что он будет работать с Chrome?
Кстати, я нашел этот вопрос на stackoverflow:Кросс-браузерный метод для установки ScrollTop элемента?, Возможно, это работает для DIV, но не для элементов SELECT и / или не в Chrome.
Спасибо!
ОБНОВЛЕНИЕ: Вот HTML-страница, которая демонстрирует проблему:
<html>
<head>
<style type="text/css">
.fields9{font-size:15px;height: 180px; width:420px; overflow: auto; border:1px solid #2d2b2d;}
</style>
</head>
<body>
<select multiple="multiple" size="10" id="myselect" class="fields9">
<option>firstone</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>option</option>
<option>lastone</option>
</select>
<script type="text/javascript">
element=document.getElementById("myselect");
//element.scrollTop = element.scrollHeight;
element.scrollTop = element.scrollHeight - element.clientHeight;
</script>
</body>
</html>
Если я смотрю это в Chrome, последний вариант «lastone» в основном обрезается снизу. НО, если я уберуclass="fields9" атрибут, проблема уходит.