javascript - jQuery 自动完成的来源是隐藏输入变量的值

Question

我正在使用 jQuery 的自动完成功能，但在获取源以引用页面上隐藏输入的值时遇到问题。

这是隐藏的输入字段：

<input type="hidden" id="array_activities" value="[{ label: 'Football', value: '1' }, { label: 'Tennis', value: '2' }, { label: 'Running', value: '3' }]">

这是javascript：

$("#search").live("focus", function (event) {
    $(this).autocomplete({
        close: function( event, ui ) { area_input(); },
        source: $("#array_activities").val()
    });
});

但没有任何东西自动完成。

如果我将源选项的值显式更改为隐藏输入的值（即替换'$("#array_activities").val()'为

'[{ label: 'Football', value: '1' }, { label: 'Tennis', value: '2' }, { label: 'Running', value: '3' }]'),

它工作正常。

有任何想法吗？

Answer 1

在将其分配为源之前对其进行解析

source: JSON.parse( $("#array_activities").val() )

由于源预计是一个array of objectsand not a string。

编辑

JSON带单引号的字符串不是有效的语法。所有属性都必须用双引号括起来才能获得有效的语法。

所以把你的价值改成这样

value='[{ "label": "Football", "value": "1" },
      { "label": "Tennis", "value": "2" }, { "label": "Running", "value": "3" }]'

小提琴

如果您希望您的代码按原样运行，那么您可以尝试使用

var arr = eval($("#array_activities").val());

但是使用 eval 被认为是一种不好的做法。

欲了解更多信息