Hierarchische Dropdown-Liste in HTML

Wenn beim Erstellen einer Webseite viele Informationen klassifiziert sind, können Sie diese auch hierarchisch in der Dropdown-Liste anzeigen, was eine klarere Anzeigeoption für Benutzer darstellt. Im folgenden Beispiel können Sie sehen, dass die Optionen in der Dropdown-Liste hierarchisch angezeigt werden. Die Ergebnisse der Programmausführung sind in der Abbildung dargestellt.

In diesem Beispiel wird hauptsächlich das optgrounp-Tag angewendet und sein LabelAttribut festgelegt. Das optgroup-Tag wird hauptsächlich zur logischen Gruppierung der Optionen im select-Element verwendet. Der im optgroup-Tag angegebene Text ist im Allgemeinen durch Ersetzen des Textfelds unterscheidbar.

Der Schlüsselcode zum Implementieren einer hierarchischen Dropdown-Liste lautet wie folgt:

<form id="form1" name="form1" method="post" action="">
  <table width="206" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td height="25" background="images/mid_01.jpg">     图书分类</td>
    </tr>
    <tr>
      <td height="28" align="center"><select name="book_class" id="book_class">
          <optgroup label="Web设计">
          <option>网站建设</option>
          <option>网页设计</option>    
          <option>JavaScript程序设计</option>
          </optgroup>    
          <optgroup label="软件世界">
          <option>软件工程</option>
          <option>软件应用</option>
          </optgroup>
        </select></td>
    </tr>
  </table></form>

Das obige ist der detaillierte Inhalt vonHierarchische Dropdown-Liste in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!