逗号分隔的字符串

Question

我有一个文本输入，每当用户选择一个新标签（一个新的创建一个新的列表元素）时，文本输入都会更新，这些列表元素被映射到一个逗号分隔的列表中，然后添加到文本输入的值中。

文字输入的值可能看起来像这样，

PHP，C＃，C，C ++

用户可以单击标签将其从文本输入中删除，但是我看不到将其从输入字段中的逗号分隔列表中删除。

对于标记删除方法，我的代码如下所示。

var array = $("#job_tags_input").val().split(",");

我虽然这会在输入中提供值的数组，但我在控制台中得到的所有内容都在console.log（array）中，

[“ C”，“ PHP”，“ Perl”，“ C＃”，“”]

如果删除了“ C”标签，如何将其从输入字段中删除？

我的JS

if($("#job_tags").get(0)) {
    $("#job_tags").tagHandler({
        assignedTags: [ 'C', 'Perl', 'PHP' ],
        availableTags: [ 'C', 'C++', 'C#', 'Java', 'Perl', 'PHP', 'Python' ],
        autocomplete: true,
        onAdd: function(tag) { 
            var s = $("#job_tags li").map(function(){
                return $(this).text();
            }).get().join(",");
            s = s.substring(0, s.length - 1);
            console.log(s);
            $('#job_tags_input').val(s);
        },
        onDelete: function(tag) { 
            /*$("#job_tags_input").val( $("#job_tags li").map(function(){
                return $(this).text();
            }).get().join(", "));*/
            var array = $("#job_tags_input").val().split(",");
            array = $.grep(array, function(value, i) {
                return ( value.indexOf(tag) == 0 );
            });
            array = array.join(",");
            console.log(array);
            $('#job_tags_input').val(array);
        }

    });
}

Answer 1

您可以先拼接项目：

array.splice(array.indexOf("C"), 1); // remove one item at the position of "C"

然后将元素结合在一起并更新文本框：

$("#job_tags_input").val(array.join()); // uses "," by default

但是，最好不要分割", "因为空格是定界符的一部分。

Answer 2

如果您使用的是jQuery，则有几种方法会有所帮助。 您可以在没有空格的情况下split（）并使用$ .trim（）清除空格，因为空格可能会或可能不会一直存在。

$ .grep（）可用于过滤数组并返回新数组。

Answer 3

尝试下面的代码检查indexOf删除的标签，然后从列表中将其splice起来。 然后通过加入拼接列表来设置输入的值。

演示

var curSelection = $('#job_tags_input').val().split(",");
var elIndex = curSelection.indexOf(t);

if (elIndex >= 0) {
    curSelection.splice(elIndex , 1);
    $('#job_tags_input').val(curSelection.join());
}

$('#job_tags_input').val(curSelection.join());

下面的函数用于Array.indexOf，

//Below code is from http://stackoverflow.com/a/144172/297641
if (!Array.prototype.indexOf) {
  Array.prototype.indexOf = function (obj, fromIndex) {
    if (fromIndex == null) {
        fromIndex = 0;
    } else if (fromIndex < 0) {
        fromIndex = Math.max(0, this.length + fromIndex);
    }
    for (var i = fromIndex, j = this.length; i < j; i++) {
        if (this[i] === obj)
            return i;
    }
    return -1;
  };
}