如何使用 JQuery 访问中继器内的 DIV 元素答案

【问题标题】：How to Access DIV element inside Repeater using JQuery如何使用 JQuery 访问中继器内的 DIV 元素
【发布时间】：2017-03-30 01:08:02
【问题描述】：

所以我有一个带有文本框的 ASP.NET 中继器控件和一个带有隐藏验证文本的 div。我正在尝试根据是否在文本框中输入特殊字符来显示此 div。我已经设法在所有文本框中应用 jquery 正则表达式，但我试图弄清楚如何将验证错误应用于用户输入输入的文本框行，因为我希望错误 div 显示此特定行上的消息。我可以让它在第一行工作，但由于转发器在 HTML 中创建了它自己的控件 ID，我想知道如何去做。这是我的代码：

$(function(){

$('[id*=txtbox1]').keyup(function()
{
    var Input = $(this).val();
    re = /[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi;
    var SplChar = re.test(Input);
    if(SplChar)
    {
        var replchar = Input.replace(/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '');
        $(this).val(replchar);
                    $('#ErrorDiv').show(); 
    }
});});



<asp:Repeater ID="rptItems" runat="server">
<ItemTemplate>
            <asp:textbox ID="txtbox1" runat="server" Text='<%# Eval("Questions") %>' />
            <div id="ErrorDiv" style="display: none;">No special characters</div>
</ItemTemplate>

有什么建议吗？感谢帮助。

【问题讨论】：

发布生成的 HTML，不要使用id="ErrorDiv"，因为 HTML 文档中的 ID 应该是唯一的。
我应该添加一个asp标签吗？作为 HTML ID 或文本框至少应该是 txtbox1_0, txtbox1_1, txtbox1_2, txtbox1_3, txtbox1_4。
发布转发器的结果 HTML...

标签： jquery html asp.net repeater

【解决方案1】：

像这样将类添加到您的文本框 html

<asp:textbox ID="txtbox1" class="question" runat="server" Text='<%# Eval("Questions") %>' />

所以你可以替换

$('[id*=txtbox1]').keyup(function() ...

到这里

$(".question").keyup(function() ...

这个#ErrorDiv 将不起作用.. 因为 ID 必须是唯一的，并且您的转发器将创建多个具有相同 ID 的 div。所以把id="ErrorDiv"改成class="errorDiv"。

错误

$('#ErrorDiv').show();

正确

// $('#ErrorDiv').show();
$(this).next(".errorDiv").show();

【讨论】：

感谢 Sudarpo Chong，我采纳了您的建议并添加了课程，而不是依赖 ID。这似乎工作，感谢帮助！
不客气，@Rankone。乐意效劳。这是我们在使用 ASP 网络表单时遇到的常见问题；）

【解决方案2】：

您面临的问题是因为 textbox-id 是独一无二的。所以唯一的解决方案是使用getElementsByName 或class 名称选择元素。

【讨论】：

感谢 Webruster 的帮助，是的，根据上面的回复，这是我继续使用的方法。