0

我有一个 ASP.NET TreeView 控件，并且在某些时候将 CSS 类添加到span元素中以提醒客户端代码禁用树中的复选框。完成并工作。

问题是CSS该类充当禁用复选框的标志，需要将其删除。执行此操作的 jQuery 似乎很简单。

我已阅读以下内容，这似乎是一个明显的解决方案： jQuery Remove CSS Class from all Descendants at once

这是渲染的源代码（它的一部分 - TreeView 很大，只要知道这些<span>元素是 TreeView 的后代：

<div id="MainContent_MyTreeView">
   .....
      <span class="disabledTreeviewNode">

因此，当需要删除此类时，我有以下jQuery 内容被击中客户端：

  function EnableAllCheckBoxes(treeviewClientID) {
     $(treeviewClientID).removeClass('disabledTreeviewNode');
  }

我也尝试过类似的变化：

$(treeviewClientID + ' span').removeClass('disabledTreeviewNode');

和：

$(treeviewClientID + ' span').removeClass();

和：

$(treeviewClientID).removeClass();

不幸的是，在我检查页面并运行 jQuery 之后，该类尚未被删除：

<div id="MainContent_MyTreeView" onclick="OnTreeClick(event)">
    <table style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;" cellspacing="0" cellpadding="0">
    <div id="MainContent_MyTreeViewn0Nodes" style="display: block;">
        <table style="border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td>
                    <td>
                    <td>
                        <input name="MainContent_MyTreeViewn1CheckBox" id="MainContent_MyTreeViewn1CheckBox" type="checkbox"/>
                            <span id="MainContent_MyTreeViewst1" style="font-weight: bold; text-decoration: none;">
                                <span class="disabledTreeviewNode">
                                    Text - My Description

我需要删除的类在底部如下<span>

<span class="disabledTreeviewNode">

我也尝试了以下方法也不起作用：

     **$(treeviewClientID + ' span').filter(function () {
        return $(this);
     }).removeClass('disabledTreeviewNode');**

该值treeviewClientID是正确的，因为我已使用它来操作树的其他部分，以便该值有效且正确。

关于为什么没有在 TreeView 控件的子元素上删除该类的任何想法<span>，或者我可能做错了什么？

编辑：添加完整的 HTML 到<span>没有被删除的类。

4

2 回答 2

1

根据您的代码，删除过程似乎很好。我相信正在发生的事情（您没有说明）是您的选择器错误。我假设您将“MainContent_MyTreeView”传递给函数 EnableAllCheckBoxes。但是，在 jQuery 中要通过 ID 引用某些内容，您需要在选择器中使用“#”。要么这样调用函数：

EnableAllCheckBoxes('#MainContent_MyTreeView');

或者像这样修改函数：

function EnableAllCheckBoxes(treeviewClientID) {
     $('#' + treeviewClientID).removeClass('disabledTreeviewNode');
  }
于 2013-09-19T18:45:04.897 回答
0

您想从列表的后代中删除该类，而不是从列表本身中删除。在这种情况下，您应该使用：

function EnableAllCheckBoxes(treeviewClientID) {
     $('span.disabledTreeviewNode', '#' + treeviewClientID).removeClass('disabledTreeviewNode');
  }

这意味着：任何位于下方的 CSSspan类都将删除 CSS 类。disabledTreeviewNode#treeviewClientIDdisabledTreeviewNode

让我们调试！

将您的功能修改为：

function EnableAllCheckBoxes(treeviewClientID) {
     console.log(treeviewClientID);
     console.log($('span.disabledTreeviewNode', treeviewClientID));
     $('span.disabledTreeviewNode', treeviewClientID).removeClass('disabledTreeviewNode');
  }

按 F12，移动到控制台选项卡并刷新页面。验证控制台上记录的内容并尝试对其进行故障排除。

编辑

根据您添加到问题中的 HTML，我确信

$('span.disabledTreeviewNode', '#MainContent_MyTreeView').removeClass('disabledTreeviewNode');

应该可以正常工作。实际上，如果您在此处打开控制台并运行

$('pre.prettyprint', '#question').removeClass('prettyprint');

您会看到它按预期工作。这是相同的逻辑。

你能检查那里是否还有其他事情发生吗？

于 2013-09-19T18:48:08.507 回答