搜索框在隐藏后，打开元素显示，搜索框里输入不了文字

Question

.search 是隐藏的
点击.search-m后，.search 显示，其他的div隐藏。（大概就是头部的其他地方在.search打开后就全部隐藏，只剩.search这个元素）
但是.search里的搜索框不能输入文字，输入不了文字，button也点击不了，就直接触发了mouseout。

请教怎么在打开.search这个元素后，让搜索框里能输入文字，点击.search外的地方后，触发mouseout。

用的代码如下，有懂的麻烦帮补充下代码！谢谢，谢谢

$(function() {
    $(".search-m").click(function() {
        $(".headers div").hide();
        $(".search").show();
    })
    $(".search-m").mouseout(function() {
        $(".headers div").show();
        $(".nav,.search").hide();
    })
})