我正在尝试使用JQuery UI自动完成插件(click to see the demo page of JQuery UI Autocomplete plugin)
我使用下面的对象列表作为数据源:
var availableTags = [
{label: "Sao Paulo", value: "SP"},
{label: "Sorocaba", value: "SO"},
{label: "Paulinia", value: "PA"},
{label: "São Roque", value: "SR"}
];
问题是,当我选择一个项目时,数据源的值设置为输入字段,而不是标签。我为选择创建了一个句柄,将项目值保存在隐藏字段中,并将标签设置为输入字段,但是插件触发此事件的时间过早,并且值重新设置为输入字段。] >
HTML:
<!DOCTYPE HTML> <html> <head> <link rel="stylesheet" type="text/css" href="JQuery.UI/1.8.14/themes/base/jquery.ui.base.css" /> <link rel="stylesheet" type="text/css" href="JQuery.UI/1.8.14/themes/base/jquery.ui.theme.css" /> <style> .ui-menu-item { font-size: 12px; } </style> <script src="JQuery/1.6.2/jquery-1.6.2.min.js" type="text/javascript"></script> <script src="JQuery.UI/1.8.14/js/jquery-ui-1.8.14.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ var availableTags = [ {label: "Sao Paulo", value: "SP"}, {label: "Sorocaba", value: "SO"}, {label: "Paulinia", value: "PA"}, {label: "São Roque", value: "SR"} ]; $("#txtCidade").autocomplete({ minLength: 0, source: availableTags); }); function OnSelect(event, ui) { var item = ui.item; var itemLabel = item.label; var itemValue = item.value; $("#hidCidade").val(itemValue); $("#txtCidade").val(itemLabel); } </script> </head> <body> <form> <input id="hidCidade" type="hidden" /> <input id="txtCidade" type="input" class="ui-autocomplete-input" /> </form> </body> </html>
请,有人可以帮我吗?
谢谢!
我正在尝试使用JQuery UI Autocomplete插件(单击以查看JQuery UI Autocomplete插件的演示页面),我在下面使用对象列表作为数据源:var availableTags = ...