Question

我有一个表单，用户可以选择输入多个选项。我当前显示一个输入字段并隐藏该选项的其余4个输入字段。

以前，我使用每个输入下的链接取消隐藏下一个输入和链接。

$(function(){ 
    $(".show").click(function () {
        $(this).parent().next("div").show();
        evenpreventDefault();
    });
});

但我想只使用一个链接来逐个取消隐藏隐藏输入（第一次点击=第一次隐藏输入，第二次点击=第二次输入......）。

这有可能在jquery，我感谢任何帮助。

Answer 1

我认为你想逐一展示，所以解决方案就是：

Working demo

<强> HTML

<div id="wrapper">
    <div>  
            <a href="#" class="show">Show</a>
    </div>
      <div class="test" id="1"><input type="text" value="1"/></div>
      <div class="test" id="2"><input type="text" value="1"/></div>
      <div class="test" id="3"><input type="text" value="1"/></div>
      <div class="test" id="4"><input type="text" value="1"/></div>
</div>

<强> JQUERY

$(".test").hide();
    $(".show").click(function () {       

        $(this).parent().siblings("div:not(:visible)").first().show();
        evenpreventDefault();
    });

show链接和隐藏链接必须具有相同的父级，因此要在同一级别的结构中，您要求可见的兄弟姐妹，但只有第一个，然后显示它。

Answer 2

..它不会处理语法错误！

$(".test").hide();
    $(".show").click(function (event) {       
        $(this).parent().siblings("div:not(:visible)").first().show();
        event.preventDefault();
});

如何使用jquery取消隐藏多个输入

2 个答案: