如何制作“混合体” HTML 下拉列表也可以用作文本框吗?

发布于 2024-09-27 15:40:17 字数 394 浏览 3 评论 0原文

对于我的网站,我需要有一种方式让用户进入他们的城市。

我想使用 2 个下拉列表:“州”和“城市”下拉列表。 “城市”列表中的选择取决于选择的“州”。

但是,肯定存在用户的“城市”不在下拉列表中的情况。为了处理这些情况,我想要“ “城市”输入是一个“混合”:虽然用户可以从下拉列表中选择一个选项,但他们也可以将输入用作文本框,然后简单地输入他们的城市名称。

我想到的一个例子是 Google地图。在 Google 地图中输入任何地址,然后单击左侧面板上的“乘坐公共交通”图标(最右侧的下拉框)。您可以从下拉列表中选择“下午 1:00”、“下午 1:30”、“下午 2:00”等选项,但您也可以在框中输入“下午 1:23”等时间。 .

我该如何做这样的事情? 有没有 javascript 库/框架可以做到这一点?

For my website, I need to have a way for users to enter their cities.

I'd like to use 2 drop-down list for that: a "State" and a "City" drop-down lists. The choices in the "City" list would depend on what "State' has been selected.

However, there bound to be cases where a user's "City" is not in the drop-down list. To handle those cases, I want the "City" input to be a "hybrid": while users could select a choice from a drop-down list, they could also use the input as a textbox and simply type out their city name.

An example of what I have in mind is Google Map. Enter any address into Google Map. Then click on "Directions" on the left panel. Then click the "By public transit" icon (2nd icon from left). The right-most drop-down box is what I'm talking about. You could select choices like "1:00pm", "1:30pm", "2:00pm" etc from a drop-down list. But you could also just type out a time like "1:23pm" inside the box.

How do I do something like that? Is there any javascript library/framework that does that? I'm currently using jQuery.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

你是我的挚爱i 2024-10-04 15:40:17

我找到了一些可能涉及的解决方案:

因此,您可能可以考虑将“选择标记支持”作为在 Google 上搜索的一个很好的单词组合。

Some solutions I've found for whom it may concern:

So probably you can consider "select taggging support" a good combination of words to search at Google.

新人笑 2024-10-04 15:40:17

有很多这样的 JavaScript 示例,使用 JQuery 或本机 JS。它们通常被称为组合框 - 因为它们能够从下拉列表中进行选择或接受键入的条目 - 其中大多数包括启用自由格式条目与仅从列表中进行选择的设置。我对特定类型没有任何经验,所以我不会提出建议,但如果你谷歌“javascript组合框”,这会让你朝着正确的方向开始:)

There are lots of JavaScript examples of this, using JQuery, or native JS. They're typically called combo boxes - for their ability to select from the drop-down or accept typed entry - most of them including settings to enable free-form entry vs forcing selection from the list only. I don't have any experience with a specific type, so I won't make a recommendation, but if you Google "javascript combo box" that'll get you started in the right direction :)

枕花眠 2024-10-04 15:40:17

如果您在您所指的 GMaps 路线页面上查看源代码,您可以看到他们是如何做到的; “下拉”按钮实际上只是一个图像。当从下拉列表中进行选择时,该值将被放入文本框中。

If you view source on the GMaps directions page that you are referring to, you can see how they do it; the "dropdown" button is really just an image. When a selection is made from the dropdown, the value is put into the textbox.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文