Jquery Autocomplete不会在单击项目列表中的按钮时关闭
我正在制作的页面上有一个特殊的设计特性,它涉及jQuery自动完成,在搜索列表旁边有按钮。我可以通过单击这些按钮绑定并成功运行事件。问题是我不想在单击按钮时关闭菜单或选择选项。这是我的密码Jquery Autocomplete不会在单击项目列表中的按钮时关闭,jquery,jquery-ui,autocomplete,Jquery,Jquery Ui,Autocomplete,我正在制作的页面上有一个特殊的设计特性,它涉及jQuery自动完成,在搜索列表旁边有按钮。我可以通过单击这些按钮绑定并成功运行事件。问题是我不想在单击按钮时关闭菜单或选择选项。这是我的密码 函数自动完成(){ $(“.header搜索框”).autocomplete({ 来源:功能(req、res){ $.ajax({ url:“/localhost:3000/autocomplete/”+req.term, 数据类型:“jsonp”, 键入:“获取”, 数据:{ 搜索:req.term },
函数自动完成(){
$(“.header搜索框”).autocomplete({
来源:功能(req、res){
$.ajax({
url:“/localhost:3000/autocomplete/”+req.term,
数据类型:“jsonp”,
键入:“获取”,
数据:{
搜索:req.term
},
成功:功能(数据){
资源(数据)
},
错误:函数(xhr){
警报(xhr.status+':'+xhr.statusText);
}
});
},
选择:功能(事件、用户界面){
}
}).data('ui-autocomplete')。\u renderItem=函数(ul,项){
返回$(“”)
.附加(“”)
.附录(ul);
}
}
任何帮助都将不胜感激
编辑:1链接到代码的简化版本。
编辑:2
我使用的是jquery UI 1.11.0版,直接从google cdn使用jquery。在JSFIDLE中找不到版本…只需取消按钮单击事件传播,而不是事件本身。这将执行默认的按钮单击事件,但将停止自动完成关闭。
在获取数据时,在ajax的成功事件中:
success: function(data) {
res(data); // Your data handling here
$('.add-interest button').click(function(event){
event.stopPropagation(); // Stop further bubbling of this click event
});
},
只需取消按钮单击事件传播,但不要取消事件本身。这将执行默认的按钮单击事件,但将停止自动完成关闭。
在获取数据时,在ajax的成功事件中:
success: function(data) {
res(data); // Your data handling here
$('.add-interest button').click(function(event){
event.stopPropagation(); // Stop further bubbling of this click event
});
},
只需取消按钮单击事件传播,但不要取消事件本身。这将执行默认的按钮单击事件,但将停止自动完成关闭。
在获取数据时,在ajax的成功事件中:
success: function(data) {
res(data); // Your data handling here
$('.add-interest button').click(function(event){
event.stopPropagation(); // Stop further bubbling of this click event
});
},
只需取消按钮单击事件传播,但不要取消事件本身。这将执行默认的按钮单击事件,但将停止自动完成关闭。
在获取数据时,在ajax的成功事件中:
success: function(data) {
res(data); // Your data handling here
$('.add-interest button').click(function(event){
event.stopPropagation(); // Stop further bubbling of this click event
});
},
您可以绑定“mousedown”事件。这里是来自JSFIDLE的代码和我的更改
$(function () {
$(document).on('mousedown', '.add-interest button', function () {
alert("Sorry, I couldn't bring the object names");
return false;
});
});
您可以绑定“mousedown”事件。这里是来自JSFIDLE的代码和我的更改
$(function () {
$(document).on('mousedown', '.add-interest button', function () {
alert("Sorry, I couldn't bring the object names");
return false;
});
});
您可以绑定“mousedown”事件。这里是来自JSFIDLE的代码和我的更改
$(function () {
$(document).on('mousedown', '.add-interest button', function () {
alert("Sorry, I couldn't bring the object names");
return false;
});
});
您可以绑定“mousedown”事件。这里是来自JSFIDLE的代码和我的更改
$(function () {
$(document).on('mousedown', '.add-interest button', function () {
alert("Sorry, I couldn't bring the object names");
return false;
});
});
请创建一个你的小提琴code@RahulGupta抱歉,但我正在努力与小提琴…我已经编辑了你小提琴链接到一个改进的工作演示。现在请描述问题出在哪里Hanks,看起来更好,所以问题是我希望警报像现在一样显示,但不希望项目选择下拉列表关闭。我希望这对你有意义。请为你的作品创作一把小提琴code@RahulGupta抱歉,但我正在努力与小提琴…我已经编辑了你小提琴链接到一个改进的工作演示。现在请描述问题出在哪里Hanks,看起来更好,所以问题是我希望警报像现在一样显示,但不希望项目选择下拉列表关闭。我希望这对你有意义。请为你的作品创作一把小提琴code@RahulGupta抱歉,但我正在努力与小提琴…我已经编辑了你小提琴链接到一个改进的工作演示。现在请描述问题出在哪里Hanks,看起来更好,所以问题是我希望警报像现在一样显示,但不希望项目选择下拉列表关闭。我希望这对你有意义。请为你的作品创作一把小提琴code@RahulGupta抱歉,但我正在努力与小提琴…我已经编辑了你小提琴链接到一个改进的工作演示。现在请描述问题出在哪里Hanks,看起来更好,所以问题是我希望警报像现在一样显示,但不希望项目选择下拉列表关闭。我希望这对你有意义。这段代码会去哪里?当我点击按钮时,正常的按钮操作会执行,但自动完成选择也会被触发,这会进入我的自动完成功能吗?嗯。。。它没有关闭,但也没有结转任何内容。。。按钮调用的函数没有被触发……是的,我想可能可以阻止按钮事件的触发,但阻止自动完成关闭是很困难的,因为为此,您必须解除其
blur
事件的绑定。@j809我需要按钮事件来完成,单击菜单中出现的按钮会导致它关闭菜单中的项目,然后…@j809 lol这是我知道按钮单击事件未触发且自动完成正在进行时所做的第一件事。。。这没有任何区别,结果与添加代码之前的结果相同。这段代码将走向何方?当我点击按钮时,正常的按钮操作会执行,但自动完成选择也会被触发,这会进入我的自动完成功能吗?嗯。。。它没有关闭,但也没有结转任何内容。。。按钮调用的函数没有被触发……是的,我想可能可以阻止按钮事件的触发,但阻止自动完成关闭是很困难的,因为为此,您必须解除其blur
事件的绑定。@j809我需要按钮事件来完成,单击菜单中出现的按钮会导致它关闭菜单中的项目,然后…@j809 lol这是我知道按钮单击事件未触发且自动完成正在进行时所做的第一件事。。。这没有任何区别,结果与添加代码之前的结果相同。这段代码将走向何方?当我点击按钮时,会执行正常的按钮操作,但会自动完成