Deutsch
Germany.ru → Форумы → Архив Досок→ Программирование

Нормальный HTML листбох?

1297 просмотров Перейти к просмотру всей ветки
25.03.23 18:51
Re: Нормальный HTML листбох?
 
uscheswoi_82 коренной житель

Вот небольшой пример, я сделал на ul-li: 

<!DOCTYPE html>
<html>
  <head>
    <title>ListBox Demo</title>
    <style>
      #listbox { width:150px; height:100px; border:1px solid #eee; overflow-y:scroll; padding:1px 1px; }
      #listbox li { width:100%; list-style:none; cursor:pointer;}
      #listbox .selected { background-color:blue; color:white; }
    </style>
    <script>
     // Очистка выделения
     function clear() {
       document.querySelector('li').style.backgroundColor = 'white';
       document.querySelector('li').style.color = 'black';
     }
    </script>
  </head>
  <body>
    <ul id="listbox">
      <li onclick="clear(); this.setAttribute('class', 'selected');">a1</li>
      <li onclick="clear(); this.setAttribute('class', 'selected');">a2</li>
      <li onclick="clear(); this.setAttribute('class', 'selected');">a3</li>
    </ul>
  </body>
</html>
Если я кому-то отвечаю, это не значит что я ему симпатизирую, каждый остаётся при своём мнении Моя ФЛ Он и Она
 

Перейти на