防止有空標籤出現無字

Question

$('.btn-tag').click(function(e) { 
    e.preventDefault(); 
    addTag(); 

}); 

$('#tags').bind({ 
    keyup: function(e) { 
     var code = e.keyCode || e.which; 
     if (code == 32) { //Enter keycode 
      addTag(); 
     } 
    }, 
    keypress: function(e) { 
     if (e.which === 32) 
      return false; 
    }, 

}); 

$('#tags').bind('copy paste', function(e) { 
    e.preventDefault(); 
}); 


$('.tags-box').on('click', '.tag-delete', function(e) { 
    e.preventDefault(); 
    $(this).parent().remove(); 
    limitofTags(); 
    compileTags(); 
}); 

limitofTags(); 


function addTag() { 
    var tag = $.trim($('#tags').val()); 
    if (tag !== '') { 
     var $tagItem = $('<div class="tag"><a href="" class="tag-delete"><i class="icn-delete"></i></a>' + tag + '</div>'); 
     $tagItem.appendTo('.tags-box'); 
     $('#tags').val(''); 
     limitofTags(); 
     compileTags(); 
    } 
} 

function compileTags() { 

    var tags = $('.tags-box').find('.tag').map(function() { 
     var text = $.trim($(this).text()); 
     if (!text) { 
      return text; 
     } 
    }).get().join(","); 
    $('#tagsAdd').val(tags); 
} 

//Limiting number of Tags 
function limitofTags() { 
    var tags = $('.tags-box').find('.tag').map(function() { 
     var text = $.trim($(this).text()); 
     if (!text) { 
      return text; 
     } 
    }).get(); 

    $("#tags").prop('disabled', tags.length >= 12); 
    var limit = 12; 
    var $counter = $('.numoftags'); 
    var remains = parseInt(limit - tags.length); 

    if (remains == 1) { 
     $counter.text(remains + ' more tags'); 
    } else if (tags.length >= limit) { 

     $counter.text('Cannot display anymore tags'); 
    } else { 

     $counter.text('Add ' + remains + ' more tags'); 
    } 
} 

HTML

<div class="fieldcontain "> 
    <h3> Tags </h3> 

    <input type="text" name="tags" id="tags"> 

    <input type="hidden" name="tagsAdd" value="" id="tagsAdd"> 

    <a href="" class="btn-tag">Add</a> 
    <div class="tag-count"> 
     <small> 
      <div class="numoftags">Add 12 more tags</div> 
     </small> 
    </div> 
    <div class="tags-box"> 



    </div> 
    </div> 

奇怪，返回false不會停止標籤盒容器中顯示哪些不應該被允許空白標籤。我希望它檢查標籤盒容器中的所有標籤在顯示標籤之前是否有單詞。如何防止在我保存草稿或發佈後沒有詞語出現的標記？

幫助感謝！

Answer 1

你可以試試這個嗎？

function compileTags() { 

    var tags = $('.tags-box').find('.tag').map(function() { 
     var text = $.trim($(this).text()); 
     if (!text) { 
      return text; 
     } 
    }).get().join(","); 
    $('#tagsAdd').val(tags); 
}