如何对不同的值使用jquery自动完成

这是我的代码

 $(function() { var availableTags1 = [ {"key": "1","name": "NAME 1"},{"key": "2","name": "NAME 2"},{"key": "3","name": "NAME 3"} ]; var availableTags2=[ {"key":"22","value":"Ahmedabad"},{"key":"23","value":"Bangalore"},{"key":"24","value":"Chandigarh"},{"key" :"25","value":"Chennai"}]; $( "#project-name" ).autocomplete({ minLength: 0, source: availableTags2, select: function( event, ui ) { $("#project-name").val( ui.item.value ); } }); });   

如果我们使用availableTags2它的工作正常。 但是，如果我们使用availableTags1不工作。 我也换成了$("#project-name").val( ui.item.name ); 。 但它没有显示任何东西。

Answer 1

用值更改此名称

旧：

 var availableTags1 = [ {"key": "1","name": "NAME 1"},{"key": "2","name": "NAME 2"},{"key": "3","name": "NAME 3"} ]; 

新：

  var availableTags1 = [ { "key": "1", "value": "NAME 1" }, { "key": "2", "value": "NAME 2" }, { "key": "3", "value": "NAME 3" } ]; 

在选择时从列表中选择任何标签时选择事件调用

这是一个例子，用json处理，用ajax调用（api调用）

 $('#selcloter').autocomplete({ source: function (request, response) { $.ajax({ url: "url", data: "{ 'inputdate': '" + request.term + "' }", dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", dataFilter: function (data) { return data; }, success: function (data) { response($.map(data.d, function (item) { return { label: item.name, value: item.name, //this is custom tag, can give any name keyvalue: item.key } })); }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(textStatus); } }); }, minLength: 2, select: function (event, ui) { $(this).val(ui.item.value) $('#HiddenFieldtosavekey').val(ui.item.KeyValue); }, open: function () { $(this).autocomplete("widget").css({ "width": 400 }); $(this).autocomplete('widget').zIndex(100002); }, close: function () { //$(this).removeClass("ui-corner-top").addClass("ui-corner-all"); } }); 

Answer 2

所以availableTags1使用这种结构

 {"key": "1","name": "NAME 1"} 

并且availableTags2

 {"key":"22","value":"Ahmedabad"} 

将name更改为value ，它的工作原理。

编辑

或者，如果您无法控制数据，则可以使用此方法

  var tags = [], temp = availableTags2; for (var i = 0; i < temp.length; i++) { tags.push({ "key": temp[i].key, "value": temp[i].value ? temp[i].value : temp[i].name ? temp[i].name : '' }); } availableTags2 = tags; 

干杯!