动态搜索栏建议



我想在用户输入一些东西来激发他搜索内容之前,在搜索栏中显示不同的单词(例如城市名称(。

像这里: https://mapify.travel/

有什么想法怎么做吗?

现在我的代码是这样的

<%= form_tag search_path, method: :get do %>
<div class="row">
<div class="col-md-5" style=" left: 22%;">
<%= text_field_tag :search, params[:search], placeholder: " z.B. Berlin", class: "suchfeld", id: "autolocation" %>
</div>
<div class="row">
<div class="col-md-2" style="margin-left: 290px;">
<%= submit_tag "search", class: "btnsearch" %>
</div>
</div>
</div>
<% end %>

您可以通过多种方式以不同程度的复杂性执行此操作。

执行此操作的一种简单方法是存储要抢先出现在数组或对象中的位置的所有选项,当用户选择搜索框时,随机选择其中的一些选项以向用户建议。

试试这个也许...其中#email是文本字段输入的 ID。

这也假定数组arry中的第一项是默认占位符值的值。如果您不想在 html 中设置硬编码的默认占位符值,则可以在文档加载时以编程方式设置占位符。

setInterval(function(){
var arry = ['example@example.com', 'placeholder 2', 'placeholder 3', 'placeholder 4']
$this = $('#email')
var old_placeholder       = $this.attr('placeholder')
var old_placeholder_index = arry.indexOf(old_placeholder)
var new_placeholder_index = (old_placeholder_index + 1) % arry.length
$this.attr('placeholder', arry[new_placeholder_index])
}, 2000);

最新更新