JQuery选择器中的可选参数

Optional parameters in JQuery seletor?

本文关键字：参数 选择器 JQuery      更新时间：2023-09-26

我正试图在JQuery中制作一个选择器，当单击文档上的任何位置时，该选择器将淡出多个列表中的元素。现在有两个列表，kiosks和profiles。我为该函数使用的代码如下：

$(document).on('click', function( e ){
    $( '.profile:not(".default") .name:not(".selected") .rename' ).fadeIn(80);
    $( '.kiosk .name:not(".selected") .rename' ).fadeIn(80);
});

有没有什么方法可以添加一个可选的选择器，这样，如果项目是一个配置文件，它也会排除default，但在其他情况下，任何名称都会使用这些规则？

编辑：我想做的是把这个函数变成一行，这样它就会变成这样：

$(document).on('click', function( e ){
    $( '[profile:not("default") .name:not("selected") .rename' ).fadeIn(80);
});

这是附加了数据绑定的HTML：

    <!-- Profiles -->
    <div class="profiles">
        <h1>Profiles</h1>
        <div data-bind="template: { name: 'profilestempl', foreach: $root.profiles }"></div>
    </div>
    <script type="text/html" id="profilestempl">
        <div class="profile" data-bind="css: { 'default' : !canChange() }">
            <div class="name" data-bind="css: { 'selected' : isSelected }">
                <input type="text" data-bind="hasfocus: $data.isSelected, value: tempName, enable: canChange(), valueUpdate: 'keyup'" />
                <span class="rename" data-bind="click: $root.selectProfile">q</span>
            </div>
        </div>
    </script>
    <!-- Kiosks -->
    <div class="kiosks">
        <h1>Kiosks</h1>
        <div data-bind="template: { name: 'kioskstempl', foreach: $root.kiosks }"></div>
    </div>
    <script type="text/html" id="kioskstempl">
        <div class="kiosk">
            <div class="name" data-bind=" css: { 'selected' : isSelected }">
                <input type="text" maxlength="30" data-bind="hasfocus:$data.isSelected, value:tempName, valueUpdate: 'keyup' " />
                <span class="rename" data-bind="click: $root.selectKiosk">q</span>
            </div>
            <select data-bind="options: $root.profiles, optionsText: 'name', value: profile"></select>
        </div>
    </script>

如果您的目标是在一行中获得它，您可以使用多重选择器。

$(document).on('click', function( e ){
    $( '.profile:not(".default") .name:not(".selected") .rename, .kiosk .name:not(".selected") .rename' ).fadeIn(80);
});
相关文章：