使用 jquery 的偶数状态检查器网格视图

Question

我有一个gridview，用户在文本框中输入一些整数，并且通过使用jquery 函数，我必须在同一行的另一个文本框中显示偶数/奇数。请看示例，网格视图中还有其他列，但我都省略了。

ID      ITEMNAME        REVIEW      
1       CUBE BOX        4           EVEN
2       G CUBE BOX      7           ODD
3       SHELL BOX       3           ODD
4       G SHELL BOX     8           EVEN 
...

这里REVIEW 列包含两个文本框，在第一个文本框中输入整数文本，对应的文本 EVEN/ODD 将显示在下一个文本框中。

<asp:GridView ID="ReviewGrid">
    <Columns>
        <asp:TemplateField HeaderText="S No." ItemStyle-Width="8%">
            <ItemTemplate>
                <%#Container.DataItemIndex+1 %>
            </ItemTemplate>
        </asp:TemplateField>                                        
        <asp:TemplateField HeaderText="REVIEW">
            <ItemTemplate>
               <input type="text" runat="server" id="review_val" class="review_val"/>
               <input type="text" runat="server" id="status_val" readonly="true" class="status_val"/>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

jquery 脚本

$(".review_val").change(function () {
    $(".status_val").val(evenodd($(this).val()));
});

我在这里使用类值，但​​它没有按预期工作。我需要单独检索每一行的 id，但是当我检查文本框的元素时，我发现每个文本框的 id 都是动态的，即每个文本框都附加了行号。我该如何解决这个问题？

Answer 1

你不能这样做 $(".status_val") 因为这适用于整个页面上的所有状态值。

您将需要使用相对搜索，可能是 $(this).next().val('evenodd')

$(".review_val").change(function () {
    $(this).next().val(evenodd($(this).val()));
});

如果您的文本框位于不同的列中，您需要：a) 为文本框提供唯一 ID，例如“review_2”，并为文本框提供数据属性

data-rowid="2"

那你就可以了

$(".review_val").change(function () {
    var rowId = $(this).data("rowid");
    $("#review_" + rowId).val(evenodd($(this).val()));
});

或者，您可以使用 .closest("td") 找到当前表格单元格，然后使用 .next() 移动到下一个 td，并使用选择器找到标签/文本框来设置 evenodd价值。

我更喜欢 ID 选项，因为它不依赖 DOM 结构