jquery - 无法使用本地数据和 tokenLimit 在 tokenInput Jquery 插件的搜索文本框中输入

Question

我在我的应用程序中使用 tokeninput 插件，其中数据是从 JSP servlet 获取并在 UI 上呈现的。此方案涉及获取如下服务区域列表：

[{"id":1,"name":"Service Area1"},{"id":2,"name":"Service Area2"},{"id":3,"name":"Service Area3"},{"id":4,"name":"Service Area4"},{"id":5,"name":"Service Area5"},{"id":6,"name":"Service Area6"}] 

这个 JSON 对象是在 JSP 中使用输入隐藏标签提供的

<input type="hidden" value="<c:out value="${serviceAreaList}"></c:out>" id = "serviceAreaList" />

其中 serviceAreaList 是从 java 服务器端代码返回的对象。

现在我有一个表单的输入文本框

<input type="text" name="serviceArea" class="input-field142" maxlength="15" id="choose_lis3" name="serviceArea"/>

令牌输入应用为：

var serviceAreaList = $("#serviceAreaList").val();
$( 'input[id=choose_lis3]' ).tokenInput(serviceAreaList, {tokenLimit: 3});

但现在在 UI 中我无法在搜索文本框字段中输入。难道我做错了什么？我调试了令牌输入代码，查询字符串为空“”因为我无法在文本中输入任何内容。