【问题标题】:Selecting child input elements' CSS class选择子输入元素的 CSS 类
【发布时间】:2018-04-25 06:28:03
【问题描述】:

我正在使用以下选择器在我的输入元素上设置/删除禁用的属性,点击按钮:

var parentElement = $("#startingClass");
parentElement.find(":input").not(".dont-enable").not(".cascadeReset").removeAttr('disabled');

我目前面临的问题是 .NET 以一种糟糕的方式呈现 RadioButtonLists:

<div id="startingClass">
    <table class="cascadeReset" id="tableID">
        <tbody>
            <tr>
                <td>
                    <input name="generatedID" disabled="disabled" id="generatedID" type="radio" value="12">
                    <label for="generatedID">Alternate</label>
                </td>
            </tr>
        </tbody>
    </table>
</div>

因此,jQuery 选择器在上面的示例中查找输入,并且因为“cascadeReset”类被应用于表,而不是输入,所以它没有忽略它,因此删除了“禁用"标签。

现在,在任何人建议之前 - 不,我不能将 CSS 类“cascadeReset”添加到输入元素。我已经看得很远了,.NET 似乎没有提供这样做的方法。我能做的最接近的方法是使用具有类的 span 标签包装输入。

不过,在我看来,我似乎应该能够修改我的 jQuery 选择器以某种方式仍然排除输入。

有什么想法吗?我能想到的最接近的方法是以某种方式告诉选择器查看父元素,但是 A)我不知道如何写,B)我觉得很容易适得其反并最终忽略元素我宁愿不要。

【问题讨论】:

    标签: jquery radiobuttonlist


    【解决方案1】:

    这可能非常糟糕(至少在理论上;在一个小页面上可能无关紧要),但您可以像这样限制 .cascadeReset 的子级输入:

    $("input").not(".cascadeReset input");
    

    适用于您的具体情况:

    var parentElement = $("#startingClass");
    parentElement.find(":input").not(".dont-enable").not(".cascadeReset input").removeAttr('disabled');
    

    【讨论】:

    • 效果很好!但是,为什么它表现不佳?假设带有 .cascadeReset 的控件相当浅(没有太多的子节点),它不应该导致更多的解析?
    • 只要它很浅,就不会太糟糕。它只需要找到一个输入,然后查看它的所有父级(一直到根级别标记)以确保它们都不是 .cascasdeReset 类。实际上,现在大多数浏览器在这类事情上都非常快,但是如果您最终得到一个复杂的页面,请记住一些事情。
    • 你是说孩子,对吧?如果我理解正确,查询的第一部分 (.find(":input")) 将搜索所有处于同一级别的元素或作为 parentElement 的子元素,并返回所有输入元素的列表。然后它会过滤掉那些有 CSS 类“.dont-enable”的,然后过滤掉那些有 CSS 类“.cascadeReset”的,并忽略它的子输入。我实际上稍微改变了它,添加了“.not(”.cascadeReset").not(".cascadeReset input"),因为我认为后者看起来太远了,并且不会捕捉到“.cascadeReset”输入跨度>
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-01-31
    • 1970-01-01
    • 1970-01-01
    • 2020-04-11
    • 2019-11-17
    • 2023-03-30
    相关资源
    最近更新 更多