Question

我正在使用此处找到的插件 - http://www.jqueryscript.net/form/Simple-jQuery-Tagging-Tokenizer-Input-with-Autocomplete-Tokens.html

github - https://github.com/firstandthird/tokens dependecies - https://github.com/jgallen23/fidel

示例用途： 1）工作示例（源数组加载到内存中） - http://jsfiddle.net/george_black/brmbyL8x/

js code：

(function () {

    $('#tokens-example').tokens({
        source: ['Acura', 'Audi', 'BMW', 'Cadillac',
            'Chrysler', 'Dodge', 'Ferrari', 'Ford',
            'GMC', 'Honda', 'Hyundai', 'Infiniti',
            'Jeep', 'Kia', 'Lexus', 'Mini',
            'Nissan', 'Porsche', 'Subaru', 'Toyota',
            'Volkswagon', 'Volvo'],
        initValue: ['Acura', 'Nissan']
    });

})();

html代码：

<h2>Cars</h2>
<input type="text" id="tokens-example" />

它运作正常。

2）配置示例有问题？（源数组是从服务器生成的，并且使用ajax加载，实际上并非如此，但您明白了这一点） - http://jsfiddle.net/george_black/xamxryn6/

function testFunctionFeed(query){
    //dynamic results from server
    return ['Acura', 'Audi', 'BMW', 'Cadillac',
            'Chrysler', 'Dodge', 'Ferrari', 'Ford',
            'GMC', 'Honda', 'Hyundai', 'Infiniti',
            'Jeep', 'Kia', 'Lexus', 'Mini',
            'Nissan', 'Porsche', 'Subaru', 'Toyota',
            'Volkswagon', 'Volvo'];

}

(function () {

    $('#tokens-example').tokens({

        initValue: ['Acura', 'Nissan'],
        query: function(query,callback){

            //show query
            $("#loggerQuery p").text(query);

            //let's say the results are dynamic from server
            var sgstions = testFunctionFeed(query);

            console.log(sgstions);
             $("#loggerCallback p").text(sgstions);

             callback(sgstions);

        }
    });

})();

但是我在控制台中收到以下错误：

Uncaught TypeError: Cannot read property 'suggestions-list-element' of undefined

在tokens的github页面中，您可以阅读我在第二个示例中使用的配置。

"query": A function that is used to retreive suggestions. By default, it will use the internal sources, 
however you can write your own function to query a database and return an array of suggestions. 
This function receives two parameters

query : The value entered by the user
callback : The function that you should call, passing the suggestions as an array, once you finished getting your results

我的问题是，我在第二个例子中是否正确使用了该插件？有没有其他人使用过特定的标记器插件？

Tokens从tokenizer插件中获得了我想要的确切行为（自定义标签，自动完成功能，易于主题等）。我真的想在ajax调用中使用它。

Answer 1

我从其中一个插件开发者那里得到了答案。

在我不工作的例子中，我调用了回调函数超出范围（请记住我没有开始的样本）。下面是正确的代码。

工作示例 - http://jsfiddle.net/george_black/vx8dnggh/

(function () {
    $('#tokens-example').tokens({

        initValue: ['Acura', 'Nissan'],
        query: function(query,callback){

            //show query
            $("#loggerQuery p").text(query);

            //let's say the results are dynamic from server
            var sgstions = testFunctionFeed(query);

            callback.call(this, sgstions);

        }
    });
})();

具有自动完成功能的Tokenizer插件。我是否正确实施？

1 个答案: