Spe*_*cer 28 html jquery autocomplete hyperlink
我正在尝试创建一个JQuery自动填充框,其中建议用于自动完成的单词是链接(类似于Facebook或Quora上发生的情况).
基本上,我希望自动完成结果下拉,我希望人们能够点击它们并导航到不同的页面.这是我目前使用的代码
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
$("input#autocomplete").autocomplete({
source: ["Spencer Kline", "Test Test Test Test Test Test Test Test Test", "php", "coldfusion", "javascript", "asp", "ruby"]
});
});
</script>
</head>
<body style="font-size:62.5%;">
<input id="autocomplete" />
</body>
</html>
kar*_*m79 66
这很简单.将源更改为对象数组,例如:
var source = [ { value: "www.foo.com",
label: "Spencer Kline"
},
{ value: "www.example.com",
label: "James Bond"
},
...
];
只需使用select方法重定向到'value',例如:
$(document).ready(function() {
$("input#autocomplete").autocomplete({
source: source,
select: function( event, ui ) {
window.location.href = ui.item.value;
}
});
});