我试图将AutoComplete UI集成到加载AJAX内容的FancyBox(一个ASP表单)中,并且在我的生活中不能让AutoComplete UI工作。
我在标准HTML页面上工作正常(不在FancyBox中)但由于某种原因,当我开始在指定字段中输入时,选项列表不会出现。
我不认为它是一个z索引问题,因为当我将表单作为独立页面进行尝试时,我可以在FireBug调试器中看到结果,但是当我将其作为FancyBox执行时却没有。
要执行FancyBox,我运行以下脚本:
$('.add').on('click', function(){
$.fancybox.open({
href: "/form.asp",
type: "ajax",
helpers : {
overlay: {
css: { 'background': 'rgba(255, 255, 255, 0.5)' }
}
},
afterShow : function() {
var url = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js";
$.getScript( url, function() {
$( "#name" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "/list.asp",
type: "post",
dataType: "json",
data: {
term: request.term
},
success: function( data ) {
response( data );
}
});
},
appendTo: "#search",
open: function() {
var position = $("#search").position(),
left = position.left, top = position.top;
$(".autocomplete-container > ul").css({left: (left + 20) + "px",
top: (top + 4) + "px" });
},
minLength: 2
});
});
},
afterClose : function(){
location.reload();
}
});});