从 PHP 数组将标签加载到输入字段中

Question

下面的这个标签系统非常适合我：

http://jsfiddle.net/Wky2Z/11/

我想为这个标签系统添加一些功能。首先，在制作标签之前，我想在输入框中加载标签。例如，我有如下 PHP 数组：

$tags = array(1 =>'hello', 'hi', 'name', 'surname');

所以，如果框内的文本适合数组中的标签之一，那么我们可以制作一个标签，同时按 Enter...我认为最好通过 Ajax 来做，因为所有标签都可以要在数据库中...

我自己尝试过，搜索了谷歌，但没有找到我真正需要的。

PS如果你不明白这个问题：记住stackoverflow的标记系统......

Answer 1

http://jsfiddle.net/NYV5T/

允许的标签是奶酪、土豆和泡菜（allowedTags 数组中的任何内容）

tags = [];
allowedTags = ["cheese","potato", "pickle"];
$("#textBox").keypress(function (e) {
    if (e.which === 13) {
        if (allowedTags.indexOf(this.value) !== -1){
            $(".target").append("<a href='#' class='tag' >"  + this.value+'<span class="cross">X</span>'+ "</a>");


        tags.push(this.value);
        this.value = "";

        }else{
            alert("not allowed tag");
        }

    }
});

$('body').on('click','.cross',function(){

    tags.splice($(this).parent('a').html(), 1);
    $(this).parent('a').remove();
});

$( "#textBox" ).autocomplete({
  source: allowedTags
});

这其中的关键部分是 if 语句 'allowedTags.indexOf' 如果 'allowedTags' 中没有匹配的标签，将返回 -1。

然后你需要做的就是从你的数据库中填充允许的标签——你可以通过一个 ajax 调用或者（如果你的列表少于 100 个标签）我会说在页面填充数组更有效加载一次。

根据 OP 要求，添加了自动完成功能以使其成为完整的解决方案。

注意！！！ - 这是假设您包含 jquery-ui