jQuery的输入自动完成功能

我想实现一个自动完成功能，我发现这里的堆栈溢出jQuery UI AutoComplete: Only allow selected valued from suggested list jQuery的输入自动完成功能

这是我使用

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

了jQuery这是我的实现

<div id="ServiceProvider"> 
<h3 style="background-color:#EA6A20 ;"><b>Please enter the name of the HR representative who provided service to you</b> </h3> 
<input autocomplete="on" type="text" name="HRName" id="HRName" value=""></br></br> 


<script> 
var validOptions = ["First Last", "First1 Last1", "First2 Last2"] 
previousValue = ""; 

$('#HRName').autocomplete({ 
    autoFocus: true, 
    source: validOptions 
}).keyup(function() { 
    var isValid = false; 
    for (i in validOptions) { 
     if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) { 
      isValid = true; 
     } 
    } 
    if (!isValid) { 
     this.value = previousValue 
    } else { 
     previousValue = this.value; 
    } 
}); 

</script> 
</div>

我得到的错误是

Uncaught TypeError: Object [object Object] has no method 'autocomplete' Customer_Survery.php:266 
(anonymous function) Customer_Survery.php:266

感谢您的帮助

来源

2013-12-18 bassxzero

自动完成是不是jQuery的一部分，你需要包括jQuery UI的太... –

你需要包含这样的加载之后jQuery库库：

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

的建议是把它包里面document.ready()

<script> 
$(document).ready(function(){ 
    var validOptions = ["First Last", "First1 Last1", "First2 Last2"] 
    previousValue = ""; 

    $('#HRName').autocomplete({ 
    autoFocus: true, 
    source: validOptions 
    }).keyup(function() { 
    var isValid = false; 
    for (i in validOptions) { 
     if (validOptions[i].toLowerCase().match(this.value.toLowerCase())) { 
      isValid = true; 
     } 
    } 
    if (!isValid) { 
     this.value = previousValue 
    } else { 
     previousValue = this.value; 
    } 
    }); 
}); 

</script>

来源

2013-12-18 17:29:01

您需要的jQuery UI包含自动完成插件：

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

你还应该包括下面的CSS之一：

black-tie，blitzer，cupertino，dark-hive，dot-luv，eggplant，excite-bike，flick，hot-sneaks，humanity，le-frog，mint-choc，overcast，pepper-grinder，redmond，smoothness，south-street， start,sunny,swanky-purse,trontastic,ui-darkness，ui-lightness和vader。

即

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/ui-lightness/jquery-ui.min.css">

幸得Downloading jQuery UI CSS from Google's CDN

来源

2013-12-18 17:37:06

jQuery的输入自动完成功能

回答

相关问题