jQuery隐藏下拉菜单或文本(实时搜索)输入焦点的Div

时间:2011-03-06 01:14:34

标签: javascript jquery html css drop-down-menu

任何人都可以帮助我吗?当用户点击下拉菜单(选择某些内容)或将焦点放在文本字段上时,我试图隐藏#hideme div。谢谢!

   #hideme {
     background:#ccc;
    }

    <script>
    $(function(){
       $('#skill_select').click(function(){
            $('#hideme').hide();
        });
    }):
    </script>
    <select>
            <option selected="selected">Pick from the list</option>
            <option>Option One</option>
            <option>Option Two</option>
    </select>
    or <input type="text" value="type something">
    <br/><br/>
    <div id="hideme">Hide Me Please</div>

2 个答案:

答案 0 :(得分:2)

提供选择和文本框ID:

<select id="mySelect">
    <option selected="selected">Pick from the list</option>
    <option>Option One</option>
    <option>Option Two</option>
</select>
or <input type="text" value="type something" id="myText">
<script type="text/javascript">
    function hideMe() {
        $('#hideme').hide();
    }

    $('#mySelect').change(hideMe);
    $('#myText').focus(hideMe);
</script>

答案 1 :(得分:1)

假设您要做的就是隐藏。

$('select, input').click(function() {
        $('#hideme').hide();
    });

如果要在用户单击外部选择或输入时再次显示div,请执行此操作

$('select,input').click(function(e) {
    e.stopPropagation();
    $('#hideme').hide();
});
$(document).click(function() {
    $('#hideme').show();
})

检查http://jsfiddle.net/2p6Y7/2/

处的工作示例

不要使用select,input。为每个人创建id,然后通过id。

选择它们