Question

我试图创建一个简单的函数，用一个等于管道函数的类来创建span。这些跨度填充在父div中。我还想确保一旦添加了一个span，另一个span就不会添加那个id / class，除非我的multiSearchEnabled boolean为真。

这是我的一些代码

function createBadge(badge_type) {
    var badge_parent_div = $("#badge-column-div");
    var badge = "<span class='badge-text " + badge_type + "'>" + badge_type + "</span>";

    if (!$(badge_parent_div.find("span").hasClass(badge_type))) {
        badge_parent_div.append(badge);
    } else {
        if (multiSearchEnabled) {
            badge_parent_div.append(badge); // Add another Badge, since search contains multiples
         }
    }
  }

然而，这似乎不起作用，此函数将运行onKeyUp因此我需要检测此类型的跨度是否已存在，所以我不复制它。

根据建议更新

function createBadge(badge_type) {
 var badge = "<span class='" + badge_type + "'>" + badge_type + "</span>";
 var bHasBadge = $("#badge-column-div").has('.' + badge_type);

 if (bHasBadge == false || (bHasBadge && multiSearchEnabled == true))
 {
     // add it
     $("#badge-column-div").append(badge);
 }
}

但是，使用以下代码，什么都没有添加。我需要它最初添加徽章，然后只有当multiSearchEnabled布尔值为true才能添加多个徽章。

Answer 1

has()检查匹配选择器的子控件。

function createBadge(sBadgeType) 
{
    var oBadgeParent = $("#badge-column-div");
    var bHasBadge    = oBadgeParent.has("span." + sBadgeType)

    if (bHasBadge == false || bMultiSearchEnabled) 
        oBadgeParent.append
        (
            $("<span class='badge-text " +sBadgeType+ "'>" +sBadgeType+ "</span>")
        );
}

如果div包含带有基于参数的类的span

根据建议更新

1 个答案: