Question

我尝试从表格行列表中切换button textbox。我正在使用asp.net mvc 4＆amp; jquery 1.9.1。问题是我点击的按钮被隐藏但文本框出现在所有行中。我的代码在下面，

<script>
    $(document).ready(function () {
        $('.btnDue').click(function () {
            $(this).hide();
            $('.txtDue').show();
        });
    });
</script>
<body>
    @foreach(var item in Model.DueList)
    {
        <tr><td><button class="btnDue">Set Due</button>@Html.TextBoxFor(modelItem => item.due, new { @class = "txtDue", hidden = "hidden" })</td></tr>
    }
</body>

如何只显示单击按钮的文本框？非常需要这个帮助。 TNX。

Answer 1

您可以使用.next function选择具有txtDue类的以下兄弟：

$('.btnDue').click(function () {
    $(this).hide();
    $(this).next('.txtDue').show();
});

jsFiddle

Answer 2

$（'。txtDue'）将应用于具有txtDue类的所有输入。要引用您单击的按钮旁边的输入，请尝试：

<script>
    $(document).ready(function () {
        $('.btnDue').click(function () {
            $(this).hide();
            $(this).siblings('.txtDue').show();
        });
    });
</script>

Answer 3

$(this).closest('tr').find('.txtDue').show();

Answer 4

$('.txtDue')指的是所有带有“＆ttxtDue＆＃39;”的div，这就是为什么当您点击任何按钮时它会显示所有div。

我不知道我们正在谈论多少文本框，但如果它不是太多，那么你可能想给他们ID，所以你可以单独引用它们。 / p>

隐藏所选项目＆amp;从jquery中的项目列表中显示另一个项目

4 个答案: