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

.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();
    })
})