PHP窗體：顯示輸入如果選擇

Question

我正在嘗試構建一個PHP窗體，其中就像在下拉菜單中選擇一個選項一樣，該選項將觸發一組與該選項相關的輸入顯示。

例如：我有一個下拉具有三個選項：A，B，C

如果A被選擇的一組具有選項來執行的顯示的下方的輸入。但是如果選擇B，則會顯示不同的設置。等等。

我該如何執行此操作？

Answer 1

相當簡單，適應需要你自己的上下文（如果你必須從其他地方得到選項，然後你需要一些AJAX）：

http://jsfiddle.net/7aydzs8j/

$(function() { 
 
    $("select").on("change", function() { 
 
     if($(this).val() === "") { 
 
      $("[data-parent]").hide(); 
 
     } else { 
 
      $("div[data-parent='" + $(this).val() + "']").show().siblings("[data-parent]").hide(); 
 
     } 
 
    }); 
 
});

[data-parent] { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option value="">Choose</option> 
 
    <option value="A">A</option> 
 
    <option value="B">B</option> 
 
    <option value="C">C</option> 
 
</select> 
 
<div data-parent="A"> 
 
    <input type="text" placeholder="additional info for A"> 
 
    <input type="text" placeholder="additional info for A"> 
 
    <input type="text" placeholder="additional info for A"> 
 
</div> 
 
<div data-parent="B"> 
 
    <input type="text" placeholder="additional info for B"> 
 
    <input type="text" placeholder="additional info for B"> 
 
    <input type="text" placeholder="additional info for B"> 
 
</div> 
 
<div data-parent="C"> 
 
    <input type="text" placeholder="additional info for C"> 
 
    <input type="text" placeholder="additional info for C"> 
 
    <input type="text" placeholder="additional info for C"> 
 
</div>

Answer 2

您可以用PHP Ajax調用 做到這一點看這裏 http://www.w3schools.com/ajax/ajax_php.asp

Answer 3

我會使用jQuery的例子，很容易做到這一點。 根據選擇的選項，您可以將類添加到元素。 所以你可以讓3個顯示屏讓他們看不見。 但是，如果選擇了A，則顯示1例如可以獲得可見選項所在的css類。

http://www.w3schools.com/css/css_display_visibility.asp < ---這應該派上用場。