简介
Twitter Typeahead.js 是一个强大的自动完成库，可以帮助用户更快地找到他们正在输入的内容。但是，默认情况下，Typeahead.js 只会在用户键入字符时才显示匹配的选项。
在本文中，我们将讨论如何修改 Typeahead.js，以便在用户点击或聚焦到输入框时立即显示所有可用选项。这对于一些特殊场景（例如在移动设备上）非常有用。
实现
要实现此功能，我们需要覆盖 Typeahead.js 的默认行为，并在 click/focus 事件发生时显示所有选项。
-- -------------------- ---- -------
--- ----- - ---------------
--- --------- - ---------------------
-- ----- ------ --
--- ---------------- - -----------------------
-- -- ------ ---- ----------- -------
---------------------- - -------- ------ ------- -
--- -- - --------------------------- ----- --------
-- - ----------- ---------
--------------- ------- -------- -- -
----------------------------------------
--------------------------------------------- ------
--------------------------
---
------ ---
--首先，我们获取 Typeahead.js 实例，并存储原始的 render 方法。然后，我们覆盖该方法，为每个选项添加一个 click/focus 事件监听器。当用户点击或聚焦到选项时，我们触发 queryChanged 事件，并使用 update 方法更新下拉列表中的所有选项。最后，我们使用 open 方法打开下拉列表，以便用户可以看到所有可用选项。
示例代码
以下是一个完整的示例，展示了如何将此功能添加到您的项目中：
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
-------------- ------------- ---- --- ------- ---- -------------------
----- ---------------- --------------------------------------------------------------------------------------------
----- ---------------- --------------------------------------------------------------------------------
------- -----------------------------------------------------------
------- --------------------------------------------------------------------------------------------------
-------
------
---- ------------------
----------- ------------- ---- --- ------- ---- ----------------
------ ----------- --------------
------
--------
--- ----- - ---------------
--- --------- - --- ------------
--------------- -------- ------- -
------ ----------------------------------------------
--
--------------- ---------------------------------
--------- -----------------------------------------------------------------------------------
---
-----------------
----- -----
---------- -----
---------- -
-- -
------- ----------
----- ------------
-------- --------
------ ---
---------- -
----------- -------- ------- -
------ ------- - ----------- - ---------
-
-
---
-- ----- ------ --
--- ---------------- - ---------------------------------------
-- -- ------ ---- ----------- -------
-------------------------------------- - -------- ------ ------- -
--- -- - --------------------------- ----- --------
-- - ----------- ---------
--------------- ------- -------- -- -
------------------------------
----------------------------------------------------------------------------- ------
------------------------------------------
---
------ ---
--
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------