Jquery 仅当单击输入时才显示div

如何仅在按下输入或文本区域时显示

div

此外，CSS的编写是否正确。。还是有一些错误

演示代码：

---

谢谢你的回答

您是否尝试过在ready（）上隐藏它并在单击时显示它

$(document).ready(function () {
    $(".info_form").hide();
    $("input").on("focus", function () {
        $(".info_form").show();

    });
});

看这里

---------编辑----------------

---

只需添加

float:left.info\u表单

类中的code>。它将保持内联状态。

修改了.info\u表单类和JS代码。下面是结果

url

---

希望这能解决你的问题

你把它隐藏在焦点上，这与你所说的你想要的是背道而驰的。最初将其隐藏，然后在焦点上显示（并在模糊上隐藏）。但是仅仅发布一些代码的链接并不是真正意义上的，也不清楚你到底想要实现什么。试着多解释一点。请在问题中也包括代码。类似于，但为什么不保持内联。。。当在外部单击时，如何隐藏div？请检查更新的答案，以便在外部单击时隐藏。谢谢你一直在线。您需要修复css。这没关系，但我想显示一个div，不太高兴您得到了答案：）

$(document).ready(function () {
    $(".info_form").hide();
    $("input").on("focus", function () {
        $(".info_form").hide();
        $(this).next('div.info_form').show();
    });
});

$(document).ready(function () {
    $(".info_form").hide();
    $("input").on("focus", function () {
        $(".info_form").hide();
        $(this).next('div.info_form').show();
    });

     $(document).click(function(e) {
        if (!$(e.target).is('input')) {
            $(".info_form").hide();
        }
    });
});