PHP表单:显示输入If选中

时间:2015-01-08 22:58:40

标签: php html forms

我正在尝试构建一个PHP表单,就好像你在下拉列表中选择一个选项来触发一组与该选项相关的输入。

示例:我有一个下拉列表,有三个选项:A,B,C

如果选择了A,则会在下方显示一组与选项A显示有关的输入。但是如果选择B,则显示不同的集合。等等。

我将如何执行此操作?

3 个答案:

答案 0 :(得分:2)

非常简单,根据需要调整自己的上下文(如果你必须从其他地方获取选项然后你需要一些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>

答案 1 :(得分:0)

你可以用php Ajax调用来做到这一点 看这里的例子 http://www.w3schools.com/ajax/ajax_php.asp

答案 2 :(得分:-1)

我会使用Jquery,这很容易。 根据所选的选项,您可以向元素添加类。 所以你可以制作3个显示器使它们不可见。 但是,如果选择A,则显示1例如可以获得可见选项所在的css类。

http://www.w3schools.com/css/css_display_visibility.asp&lt; ---这应该派上用场了。