时间戳

首页 > 解决方案 > 当用户专注于输入时如何推荐文本

javascript - 当用户专注于输入时如何推荐文本

问题描述

我的页面中有一个搜索框，我想推荐我的页面的某些部分，当用户关注我的搜索框输入时，写一些东西

<input type="text" placeholder="Search...">

我想向用户推荐：最好的手机、最好的 2021 年笔记本电脑等......

标签： javascripthtmlformsinputtext

解决方案

您可以通过 JQuery（如果您可以使用 JQuery）在此字段上捕获“单击”事件，然后显示建议。

如果推荐是您不需要在数据库中拥有的固定文本，您可以将它们放在隐藏的 div 中，当用户单击搜索框时，将 div 变为可见。

非常基本的 JQuery 代码示例：

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
</head>
<body>
    <form>
        <input type="text" placeholder="Search..." id="myAmazingSearchBox">
    </form>

    <div id="recommendations" style="display:none">
        <p>Best phones , best 2021 laptops etc...</p>
    </div>

    <script type="text/javascript">
        $("#myAmazingSearchBox").click(function() {
            $("#recommendations").fadeIn();
        });
    </script>
</body>

推荐阅读