Question

 var bubble = $('.bubble');
    $('.bookmark-list').on('click', '.bookmark-link', function(e) {
        e.preventDefault();
        addBookmarkItem($(this));      
    });

HTML

<div class="bookmark-list">
<div>
<a class="bookmark-link active" href="">
  test
  <span class="count">
    1
  </span>
</a>
</div>

//below new created bookmark group  
<div>
  <a class="bookmark-link" href="">
    test
    <span class="count">
      0
    </span>
  </a>
  </div>
</div>
<div class="actions">
<a href="javascript:void(0);" class="add" data-dismiss="modal" aria-hidden="true">Save</a>
</div>

尝试仅在未勾选书签链接时显示气泡（如在活动含义中勾选计数数字大于0）。但问题是，在模态下，在输入中键入“example”并添加它，然后它只会在点击“示例”时显示气泡反弹如果有书签链接，如何防止气泡出现？

更新

 var count = $('.bookmark-link').find('.count').data('count');
if (count > 0) {
    bubble.hide;
} else {
    bubble.show();
    bubble.addClass('bounce');
}

想出来了。它似乎工作但不确定它是否正确

Answer 1

$('.bookmark-list').on('click', '.bookmark-link', function(e) {
    e.preventDefault();
    addBookmarkItem($(this));
   if ($('.bookmark-link.active').children('.count').text()>0) {
        bubble.hide();
        bubble.removeClass('bounce');
        return;
   }else{
        bubble.show();
        bubble.addClass('bounce');
    }

});

我不知道你是否也要添加书签，但这应该是这样做的。它检查相应的计数，只显示小于1的气泡。

编辑：将addBookmark放在您想要的位置，具体取决于您是否要在点击时添加书签。

编辑：添加此项以使用您的参数在保存时显示气泡：

$('a.add').on('click', function(){
    if ($('.bookmark-link.active').children('.count').text()>0) {
        bubble.hide();
        bubble.removeClass('bounce');
   }else{
        bubble.show();
        bubble.addClass('bounce');
    }
}

单击“保存”时，如果任何书签链接具有活动类且计数大于0，则会隐藏气泡，否则将显示气泡。

编辑bootstrap模式：

$('#id of modal').on('hidden.bs.modal', function(e){
    if ($('.bookmark-link.active').children('.count').text()>0) {
        bubble.hide();
        bubble.removeClass('bounce');
   }else{
        bubble.show();
        bubble.addClass('bounce');
   }
}

我们可以将show bubble绑定到bootstrap模式关闭而不是添加按钮。

添加新组到列表，然后它应该能够显示气泡

1 个答案: