JSON 使用 jquery 令牌输入解析字符串时出现问题

Issue with JSON parsing a string with jquery token input

我在我的一个项目中使用 jquery 令牌输入。以下是我发起tokeninput的方式。

    $(document).ready(function(){
    var defaultOptions = {  searchDelay: 500,
                            minChars: 3,
                        };
    $('.tokeninput').each(function () {
        var field = $(this),
            dataOptions = field.data('tokenoptions');
            if(dataOptions){
                defaultOptions = $.extend(defaultOptions, dataOptions);
            }                   
            console.log(defaultOptions);
        field.tokenInput("url_to_live_search', defaultOptions);
    });
});  

然后我在我的输入字段中使用“数据”属性传递额外的参数

<input value="105" name="institution_id" required="required" class="tokeninput" data-tokenoptions="<?php echo json_encode(['tokenLimit'=>1,'allowFreeTagging'=>true]);?> type="text">

到目前为止一切正常。但是,当我尝试通过数据选项也传递 prePopulate 参数时,如下所示,出现错误。

<input value="105" name="institution_id" required="required" class="tokeninput" data-tokenoptions="<?php echo json_encode([tokenLimit] => 1, [allowFreeTagging] => 1, [prePopulate] => {"id":105,"name":"Institution Title"});?> type="text">

错误 未捕获的类型错误:无法使用 'in' 运算符在 {"id":105,"name":"Institution Title"}

中搜索 'length'

我已经搜索过这个问题 found that the problem 是因为没有解析 JSON。我尝试对我的启动器进行一些修改。但它不起作用。任何帮助将不胜感激。

我对启动器及其工作方式进行了以下更改。但我不确定这是否是正确的方法。可以指导吗

    $(document).ready(function(){
    var defaultOptions = {  searchDelay: 500,
                            minChars: 3
                        };
    $('.tokeninput').each(function () {
        var field = $(this),
            dataOptions = field.data('tokenoptions');
            if(dataOptions){
                var populateValue = dataOptions.prePopulate;
                if(populateValue){
                    dataOptions = jQuery.grep(dataOptions, function(a) {
                        return a !== 'prePopulate';
                    });
                    populateValue = $.parseJSON(populateValue);
                    dataOptions = $.extend(defaultOptions, {prePopulate:[populateValue]});                                              
                }
                defaultOptions = $.extend(defaultOptions, dataOptions);
            }                   
            console.log(defaultOptions);
        field.tokenInput("url_to_live_search", defaultOptions);
    });
});