如何覆蓋select的默認行爲：在jQuery UI Autocomplete中？

Question

我有以下幾點：

$('#<%=txtCity.ClientID%>').autocomplete({ 
    source: function (request, response) { 
    var parameters = { 
     isoalpha2: '<%=Session["BusinessCountry"].ToString()%>', 
     prefixText: request.term 
    }; 
    $.ajax({ 
     url: '<%=ResolveUrl("~/AtomicService/Assets.asmx/GetCitiesWithState")%>', 
     type: 'POST', 
     dataType: 'json', 
     contentType: 'application/json; charset=utf-8', 
     data: JSON.stringify(parameters), 
     success: function (data) { 
     response($.each(data.d, function (index, value) { 
      return { 
      label: value.slice(value.indexOf(',')), 
      value: parseInt(value.split(',')[0]) 
      } 
     })); 
     } 

    }); 
    }, 
    minLength: 2, 
    delay: 50, 
    select: function (event, ui) { 
    var city = ui.item.label.split(',')[0]; 
    var state = ui.item.label.split(',')[1]; 
    alert(city); 
    alert(state); 
    $('#<%=txtCity.ClientID%>').val(city); 
    $('#<%=txtState.ClientID%>').val(state); 
    }, 
}); 

這是所有幸福的日子，除了當我選擇從自動完成列表中的項目，我想不會有自動完成填充$('#<%=txtCity.ClientID%>')元素。我該怎麼做？我看到了.insertAfter，我應該看看嗎？

幫助讚賞。

Answer 1

嘗試從select event返回false：

... 
select: function(event, ui) { 
    var city = ui.item.label.split(',')[0]; 
    var state = ui.item.label.split(',')[1]; 
    alert(city); 
    alert(state); 
    $('#<%=txtCity.ClientID%>').val(city); 
    $('#<%=txtState.ClientID%>').val(state); 
    return false; 
}, 

從文檔（選擇事件）：

當選擇從菜單 的項目觸發; ui.item引用 所選項目。 select的默認操作是將文本字段的 值替換爲所選 項目的值。 取消此事件會阻止 的值更新，但 不會阻止菜單關閉。

You can try it here.

Answer 2

雖然它可能不會有所作爲這裏，而不是返回false，你應該說event.preventDefault

見event.preventDefault() vs. return false

這是不好的做法，總是當你不需要的時候停止傳播事件。