查找 HTML 复选框

本文关键字：复选框 HTML 查找 | 更新日期: 2023-09-27 18:30:59

如何从 C# 找到动态生成的 HTML 复选框。需要通过 id 找到它们并将其标记为选中。

此代码首先生成 HTML：

StringBuilder sbHtml = new StringBuilder("");
sbHtml.Append("<div class='"checkboxBtn'">");
sbHtml.Append("<input type='"checkbox'" runat='"server'" 
                class='"chkBx'" id='"" + 
                Convert.ToString(someid) + "'" />");
sbHtml.Append("<label>Compare</label>");                    
sbHtml.Append("</div>");

并且呈现的 HTML 是

<div class="checkboxBtn">
 <span class="uncheked"></span>
 <input type="checkbox" runat="server" class="chkBx" id="23"></input>
 <label>Compare</label>
</div>

有很多这样的复选框，我想通过ID找到它们

string[] PhoneIds = {"11","23","43"};
foreach(string id in PhoneIds)
  {
    HtmlInputCheckBox cBox = form1.FindControl(id) as HtmlInputCheckBox;
    if(cBox!=null)
     {
       //cb.checked = true;
     }
  }

if 条件始终失败，就像复选框不存在一样。这里应该做什么。

查找 HTML 复选框

你只为你的字符串 PhoneID 分配一个数字：

string[] PhoneIds = ["11,23,43"];

相反，您需要使用：

string[] PhoneIds = {"11","23","43"};

然后你会找到它们。

因为否则你会给你的数组分配一个字符串，而这个字符串将是11,23,43的，只要你没有该字符串的复选框，if-condition就会失败。

此外，您不应该使用数字作为ID，因为您可以在此答案中查看，其中指出直到HTML5

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

你必须从一封信开始。也许您的浏览器不支持HTML5？

HTML

中的元素 ID 不能以数字开头。这可能就是 ASP.NET 也找不到它的原因。我会在上面加上前缀，例如cbox11.

要修复 HTML，请执行以下操作：

StringBuilder sbHtml = new StringBuilder("");
sbHtml.Append("<div class='"checkboxBtn'">");
sbHtml.Append("<input type='"checkbox'" runat='"server'" 
                class='"chkBx'" id='"cbox" + 
                Convert.ToString(someid) + "'" />");
sbHtml.Append("<label>Compare</label>");                    
sbHtml.Append("</div>");

对于循环

string[] PhoneIds = {"11", "23", "43"};
foreach(string id in PhoneIds)
{
    HtmlInputCheckBox cBox = form1.FindControl("cbox" + id) as HtmlInputCheckBox;
    if(cBox!=null)
    {
        //cb.checked = true;
    }
}

你不需要在后面的代码中检查这些，可以在jQuery中完成：

<div class="checkboxBtn">
    <span class="uncheked"></span>
    <input type="checkbox" runat="server" class="chkBx" id="23"></input>
    <label>Compare</label>
</div>
<script type="text/javascript">
   $(function(){
        $('div.checkboxBtn input[type="checkbox"]').prop('checked', true);
   });
</script>

这将选中div.checkboxBtn的所有子复选框。

相关文章：