单击页面时隐藏div，除非单击特定div

Question

当用户点击topic_tag_sug或其任何子元素时，该div不应隐藏。但是当用户点击任何其他元素时，topic_tag_sug应该隐藏。

HTML

<input id='topic_tag' onblur="$('#topic_tag_sug').hide();"/>
<div id='topic_tag_sug' style='border:1px solid #000'>here is tag suggestion zone, i want to click here to select tag suggestion, and it will not be hide</div>​

的JavaScript

$('#topic_tag').focus();

http://jsfiddle.net/Q7hFw/2/

Answer 1

我很有趣，你想隐藏其他事件的建议框。让我们在框内添加一个关闭按钮，

<input id='topic_tag' />
<div id='topic_tag_sug' style='border:1px solid #000;display:none;'>
    here is tag suggestion zone, i want to click here to select tag suggestion, and it will not be hide
    <br>
    <a id="close" href="#">X: Close</a>
</div>

现在使用jQuery添加一些javaScript代码

$(document).ready(function() {
    $('#topic_tag').bind('click', function() {
        $('#topic_tag_sug').show();  
    });    
    $('#close').bind('click', function() {
        $('#topic_tag_sug').hide();
    });        
});

请找到工作示例here