I want to enable jquery autocomplete when user enters @
I want to use jQuery autocomplete when user enter @ in textbox for entering email address
when user enter @ afrer typing his email id domain name list like @gmail.com, hotmail.com, yahoo.com should be
populated so that user can select it instead of typing it from autocomplete.
I tried but it is not working
my code is
<!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 type="text/javascript">
$(document).ready(function() {
开发者_StackOverflow中文版 var autocompOpts = {
minChars:0,
matchSubset:false,
matchContains: true,
disabled: true,
source : ["@gmail.com", "@yahoo-inc.com", "@yahoo.com", "@yahoo.co.in", "@rediff.com", "@rediffmail.com", "@hotmail.com", "@msn.com", ]
};
$("input#autocomplete").autocomplete(autocompOpts);
$("input#autocomplete").bind('keyup', function(event) {
if(event.shiftKey==1)
{
if(event.keyCode==50)
{
$("input#autocomplete").autocomplete( "option", "disabled", false );
var opt = $("input#autocomplete").autocomplete( "option", "disabled");
alert(opt);
}
}
});
});
</script>
</head>
<body style="font-size:62.5%;">
<center>
<input id="autocomplete" />
</body>
</html>
Here we go: On jsfiddle.net
The code:
$(document).ready(function() {
var autocompOpts = {
minChars:0,
matchSubset:false,
matchContains: true,
source : []
};
var domains = [
"@gmail.com",
"@yahoo-inc.com",
"@yahoo.com",
"@yahoo.co.in",
"@rediff.com",
"@rediffmail.com",
"@hotmail.com",
"@msn.com"
];
var input = $("#autocomplete");
input.autocomplete(autocompOpts);
input.bind('keyup', function(event) {
if (event.shiftKey == 1 && event.keyCode == 50) {
var userName = $(this).val();
userName = userName.substring(0, userName.length - 1);
var emailIDs = [];
$.each(domains, function(index,domain){
emailIDs.push(userName + domain);
});
autocompOpts.source = emailIDs;
$(this).autocomplete(autocompOpts);
}
});
});
Let me first clean your code up a little:
$(document).ready(function()
{
var autocompOpts = {
minChars:0,
matchSubset:false,
matchContains: true,
disabled: true,
source :[
"@gmail.com",
"@yahoo-inc.com",
"@yahoo.com",
"@yahoo.co.in",
"@rediff.com",
"@rediffmail.com",
"@hotmail.com",
"@msn.com"
]
};
var input = $("#autocomplete");
input.autocomplete(autocompOpts);
input.bind('keyup', function(event)
{
if(event.shiftKey == 1 && event.keyCode == 50)
{
input.autocomplete({disabled: false});
}
});
});
Done some small fixes and code cleaning, give that a try.
Also, are you even including the libary ?
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script>
精彩评论