依存型<select> HTMLとJavaScriptのメニュー

Question

私のページには2つの<select>フィールドがあります。最初は、いくつかの例示のブランド名を以下に示します。ユーザーは、この最初のフィールドに「アップル」を選択

<select name="1"> 
      <option value="Apple">Apple</option> 
      <option value="Samsung">Samsung</option> 
      <option value="other">Other</option> 
    </select> 

場合、私は

として、ユーザが選択するための第二は、Appleの製品が含まれているために、このようなことを伝えたいです

<select name="Apple"> 
      <option value="iphone">iPhone 7</option> 
      <option value="ipad">iPad Super Pro</option> 
      <option value="other">Other</option> 
    </select> 

「サムスン」を選択した場合は、それに応じて第2フィールドのオプションを更新したいと思います。

<select name="Samsung"> 
      <option value="note">Note 6</option> 
      <option value="galaxy">Galaxy S8</option> 
      <option value="other">Other</option> 
    </select> 

ユーザーが「その他」を選択した場合は、入力フィールドを表示する必要があります。

<input type="text" name="other"/> 

どうすればいいですか？

Answer 1

希望の動作を実現するために、の列を選択するには、の列を選択する必要があります。これは純粋にHTMLで行うことはできません。あなたが望むようにJavaScriptでいくつかのプログラミングロジックが必要になります。

トピックには、以下のリンクで詳細に説明されています

• How to populate a cascading Dropdown with JQuery
• populate second dropdown based on selected value of first dropdown
• How to populate second dropdown in $.ajax() depending on value of first dropdown?
• Populate second select-dropdown based on choice of first select-dropdown and populate the external content below the radiobuttons
• How does one make a cascading drop-down list in HTML with JavaScript?
• Javascript Cascading Drop Down Menu With 4 Hierarchical Boxes

注：質問でJavaScriptを明示的に記述していないため、この質問には重複していません。