如何解决具有多个值的自动完成文本区域
| 是否有任何代码示例如何制作允许用户键入多个值的自动完成文本区域。对自动完成列表的建议必须来自ldap。我使用Spring框架。解决方法
您可以为此尝试这些Jquery插件
At.js插件
要么
jQuery文本完成
要么
引导标签自动完成
,
<!doctype html>
<html lang=\"en\">
<head>
<meta charset=\"utf-8\">
<title>jQuery UI Autocomplete - Multiple values</title>
<link rel=\"stylesheet\" href=\"//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css\">
<script src=\"//code.jquery.com/jquery-1.10.2.js\"></script>
<script src=\"//code.jquery.com/ui/1.11.4/jquery-ui.js\"></script>
<link rel=\"stylesheet\" href=\"/resources/demos/style.css\">
<script>
$(function() {
var availableTags = [
\"ActionScript\",\"AppleScript\",\"Asp\",\"BASIC\",\"C\",\"C++\",\"Clojure\",\"COBOL\",\"ColdFusion\",\"Erlang\",\"Fortran\",\"Groovy\",\"Haskell\",\"Java\",\"JavaScript\",\"Lisp\",\"Perl\",\"PHP\",\"Python\",\"Ruby\",\"Scala\",\"Scheme\"
];
function split( val ) {
return val.split( /,\\s*/ );
}
function extractLast( term ) {
return split( term ).pop();
}
$( \"#tags\" )
// don\'t navigate away from the field on tab when selecting an item
.bind( \"keydown\",function( event ) {
if ( event.keyCode === $.ui.keyCode.TAB &&
$( this ).autocomplete( \"instance\" ).menu.active ) {
event.preventDefault();
}
})
.autocomplete({
minLength: 0,source: function( request,response ) {
// delegate back to autocomplete,but extract the last term
response( $.ui.autocomplete.filter(
availableTags,extractLast( request.term ) ) );
},focus: function() {
// prevent value inserted on focus
return false;
},select: function( event,ui ) {
var terms = split( this.value );
// remove the current input
terms.pop();
// add the selected item
terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
terms.push( \"\" );
this.value = terms.join( \",\" );
return false;
}
});
});
</script>
</head>
<body>
<div class=\"ui-widget\">
<label for=\"tags\">Tag programming languages: </label>
<textarea id=\"tags\"><textarea>
</div>
</body>
</html>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。