2

我在 ASP.NET 的 web 表单中使用树视图控件,呈现的 HTML 如下所示:

<td class="SingleCheckbox ctl00_ContentPlaceHolder1_FormView1_TreeView1_2" style="white-space:nowrap;">
   <input type="checkbox" name="ctl00_ContentPlaceHolder1_FormView1_TreeView1n32CheckBox" id="ctl00_ContentPlaceHolder1_FormView1_TreeView1n32CheckBox">
   <span class="ctl00_ContentPlaceHolder1_FormView1_TreeView1_0 SingleCheckbox ctl00_ContentPlaceHolder1_FormView1_TreeView1_1" id="ctl00_ContentPlaceHolder1_FormView1_TreeView1t32" style="border-style:none;font-size:1em;">
       Admissions and Jobs
   </span>
</td>

我想用 = "id of checkbox" 的标签替换这个跨度以在其上应用样式。

我尝试在 jQuery 上进行一些搜索以访问这些标签并使用.html(""),但这一个替换了跨度内的文本而不是跨度本身。

我希望结果是

<td class="SingleCheckbox ctl00_ContentPlaceHolder1_FormView1_TreeView1_2" style="white-space:nowrap;">
   <input type="checkbox" name="ctl00_ContentPlaceHolder1_FormView1_TreeView1n32CheckBox" id="ctl00_ContentPlaceHolder1_FormView1_TreeView1n32CheckBox">
   <label for="ctl00_ContentPlaceHolder1_FormView1_TreeView1n32CheckBox" class="ctl00_ContentPlaceHolder1_FormView1_TreeView1_0 SingleCheckbox ctl00_ContentPlaceHolder1_FormView1_TreeView1_1" id="ctl00_ContentPlaceHolder1_FormView1_TreeView1t32" style="border-style:none;font-size:1em;">
       Admissions and Jobs
   </label>
</td>

注意:我无法通过 id 访问这些元素,因为树中的每个节点都有一个唯一的 id

4

1 回答 1

0

您可以使用 jQuery 创建标签。下面的代码片段将在 CheckBox 之后使用正确的“for”创建一个新的 Label 元素并隐藏跨度

<script>
    $('#tableID input[type=checkbox]').each(function () {
        var span = $(this).next('span');
        var labelText = span.html();
        span.hide();
        $('<label for="' + $(this).prop('id') + '">' + labelText + '</label>').insertAfter($(this));
    });
</script>

或者创建一个 ASP.NET 适配器来生成自定义的 html。但这要复杂得多。请参阅更改表 ASP.NET 中复选框列表的 css 样式

于 2019-07-20T09:03:09.807 回答