我正在尝试使用JQuery UI自动完成,但遇到了一些麻烦。我现在的主要问题是我想将自动完成的任何内容存储到变量中供我操作,但我似乎无法访问该数据。相反,我在我的控制台中收到以下错误:“未捕获的ReferenceError:未定义自动完成”。如果您转到我的JSFiddle(http://jsfiddle.net/uMqyn/769/)并查看JavaScript区域中的第10-14行,您将看到我尝试执行此操作的位置。
这是我的HTML:
<!-- language: HTML -->
Search: <input class="search-variety-autocomplete" />
<div class="Arugula-DragonsTongue option" style="display:none;">
Arugula - Dragon's Tongue
</div>
<div class="Arugula-Astro option" style="display:none;">
Arugula - Astro
</div>
<div class="t11 Kale-Starbor option" style="display:none;">
Kale - Starbor
</div>
<div class="Basil-Genovese option" style="display:none;">
Basil - Genovese
</div>
这是我的JavaScript:
$("input.search-variety-autocomplete").keypress(function () {
$('.option').fadeOut("fast");
});
$('input.search-variety-autocomplete').autocomplete({
open: function( event, ui ) {
$(".ui-autocomplete").hide();
},
minLength: 3,
source: ["Arugula - Astro", "Arugula - Dragon's Tongue", "Kale - Starbor", "Basil - Genovese"],
response: function(event, ui){
//var itemValue = ui-autocomplete.value;
//var itemValue = ui-autocomplete;
var itemValue = ui-autocomplete-input; // If I type "bas", this should equal "Basil - Genovese"
console.log(itemValue);
//var $itemClass = itemValue.replace(/ /g, '').replace("'", "");
//$('.' + $itemClass).fadeIn("fast");
}
});