![](/img/trans.png)
[英]How to get JQuery-UI autocomplete to submit on pressing enter while using categories from remote source?
[英]How to fire click event on pressing enter Jquery-UI autocomplete
我有以下JS:
$("#search").autocomplete({
source: function (request, response) {
$.ajax({
url: "/Home/GetCompanyNames",
dataType: "json",
data: "searchterm=" + request.term,
success: function (data) {
response($.map(data, function (item) {
return {
label: item.Name,
value: item.Name,
LogoUrl: item.LogoUrl,
InternetName :item.InternetName,
Name: item.Name
};
}));
}
});
},
minLength: 1
}).data("autocomplete")._renderItem = function (ul, item) {
var innerHtml = '<a href=/Store/'+item.InternetName+'><div class="list_item_container" style="height: 60px;"><div class="image" style="float: left; margin-right: 35px;"><img src="' + item.LogoUrl + '"></div><div class="label">' + item.Name + '</div></div></a>';
return $("<li></li>")
.data("item.autocomplete", item)
.append(innerHtml)
.appendTo(ul);
};
});
这使得这个
这是一个建议下拉列表,显示在这种情况下,当我在诸如ib
文本框中输入任何字符时,
一切正常,但是当我用鼠标单击任何下拉菜单时,只有一个问题,它会将我带到锚标签中写入的网址,我希望如果我向下滚动并在某些项目上按Enter键,它将可以同样,当我在下拉菜单项上按Enter时,它什么也没做。
看看这个jqFAQ.com主题,这将帮助您导航到通过单击鼠标并按Enter进行选择的URL。 自动补全相关的常见问题解答也很少。
尝试将keyup
处理程序添加到返回的列表项中的a
元素上。 您应该可以通过修改_renderItem
函数来做到这_renderItem
:
._renderItem = function (ul, item) {
var div = $('<div />'), //building using DOM elements, rather than HTML string.
liContainer = div.clone().addClass('list_item_container').css('height', '60px'),
img = $('<img />').attr('src', item.LogoUrl),
imgContainer = div.clone().addClass('image').css({
"float": "left",
"margin-right": "35px"
}),
divLabel = div.clone().addClass('label').text(item.Name),
a = $('<a />').attr('href', '/Store/' + item.InternetName);
imgContainer.append(img);
liContainer.append(imgContainer).append(divLabel);
a.append(liContainer);
a.on('keyup', function (e) { //add keyup handler to navigate to new URL on [Enter]
if (e.which === 13) {
window.location.href = $(this).attr('href');
}
});
return $("<li></li>")
.data("item.autocomplete", item)
.append(a)
.appendTo(ul);
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.