点击外部时，JQuery自动完成关闭选项 [英] JQuery Autocomplete close option when click outside

问题描述

我想知道如果在JQuery自动完成中有一种方法，如果我点击OUTSIDE选项框选择或单击键盘中的ESCAPE，何时打开选项。它关闭，而不必选择一个选项。

任何人都知道正确的方法吗？仍然认为使用某些东西来检查是否重点关注自动完成，如果不关闭它，但只是一个IDEA。

谢谢

解决方案

只需关闭对话框关闭时的自动完成：

 code> $（＃dialog）。对话框（{
 close：function（）{
 $（'＃tags'）。autocomplete（'close'）; 
} 
}）; 
  

看到这个行动： http://jsfiddle.net/william/3Yz9f/1/ 。

---

更新

这取决于你的意思是一般。 JavaScript非常注重事件导向。所以，最初，当关闭对话框时，您希望自动完成关闭，因此是答案的第一部分。当然，您可以将其绑定到某些间接事件，例如自动完成模糊或隐藏（您可能需要为隐藏进行自定义事件），但这会给您一些可能不被触发的风险，因为它们是间接的。

现在，您希望在拖动对话框时关闭它;那么这也不难;您可以通过对话框的 dragStart 事件来实现这一点，但它们是两个不同的事件，无论是在对话框上，而不是自动完成。当对话框被拖动时，我看不到自动完成小部件本身的任何间接事件。

如果您的问题是通过ID引用自动完成小部件，则可以使用上下文 - 基于选择器，例如使用 $（'。ui-autocomplete-input'，this）而不是 $（'＃tags'）对话框的事件处理程序。

I would like to know if there's a way in JQuery Autocomplete, when is open the options if I click OUTSIDE the options box to select or click ESCAPE in the keyboard. It closes, without having to select one option.

Anyone know the correct way to do it? Still thought using something to check if focus the autocomplete , if not to close it but is just an a IDEA.

Thanks

解决方案

Just close the autocomplete when the dialog is closed:

$("#dialog").dialog({
    close: function() {
        $('#tags').autocomplete('close');
    }
});

See this in action: http://jsfiddle.net/william/3Yz9f/1/.

---

Update

It depends what you mean by being "general". JavaScript is very much event-oriented. So, initially, you want autocomplete to close when dialog is closed, hence the first part of the answer. Sure you can bind it to some indirect events, such as autocomplete blur or hide (you may need to do a custom event for the hide), but that gives you a bit of risk that they might not be triggered, as they're indirect.

Now you want it to close when dialog is dragged; well, that's not hard either; you can achieve this with the dragStart event for dialog, but they're two different events, both on dialogs, not autocomplete. I don't see any indirect event on autocomplete widget itself when dialog is dragged.

If your issue is referring to the autocomplete widget by ID, you could use a context-based selector, e.g. use $('.ui-autocomplete-input', this) rather than $('#tags') in dialog's event handlers.

这篇关于点击外部时，JQuery自动完成关闭选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！