当达到maxTags

Question

我正在使用bootstrap tags input，以下代码运行正常。我正在使用maxTags: 10，因此用户可以选择最多10种语言，如果他们尝试添加更多语言，则它不会出现在输入字段中。

我的问题是当用户尝试选择超过maxTags时显示警告消息。我检查了他们的文档，无法得到任何解决方案。是否可以使用bootstrap标签输入？或者在用户达到maxTags时显示警报的任何其他解决方案。

请帮忙......

var languages = new Bloodhound({
    datumTokenizer: Bloodhound.tokenizers.obj.whitespace("name")
    , queryTokenizer: Bloodhound.tokenizers.whitespace
    , prefetch: "./assets/languages.json"
});
languages.initialize(), 
$("#inputtags").tagsinput({
    maxTags: 10
    , freeInput: !1
    , typeaheadjs: {
        name: "id"
        , displayKey: "name"
        , valueKey: "name"
        , source: languages.ttAdapter()
    }
});

Answer 1

我通过获取length类的span并验证它来找到解决方案。当用户单击输入标记时，它将计算所选范围的长度并对其进行验证。目前，它没有任何错误，工作正常。如果您发现任何其他最佳解决方案，请建议。

感谢@mrdeadsven

$(".tt-dataset-id").click(function(){ 
    var numItems = $('.tag').length -1; //when page load it has one extra span for .tag class
    console.log(numItems);
    if(numItems>=10){
        alert('Maximum 10 languages are allowed');
    }
});