不同事件类型上的 Javascript 事件 stopPropagation

Question

我有一个标签，当“聚焦”时，我会显示一个 .当我单击文档正文时，我希望它关闭。但是，当使用两种不同的事件类型时，这似乎不起作用：

<input id='input' />  
<div id='div style='display:none;'>
</div>

$('#input').focus( function(e){  
   e.stopPropagation();  
   $('#div').show()  
});

$(document).click( function(){  
   $('#div').hide();  
});

似乎e.stopPropagation() 仅停止传播“onfocus”事件。自从我将代码切换为：$('#input').click() 之后，它就可以正常工作了。

只是好奇是否有任何方法可以使用上述代码进行此操作？ （想更了解JS）

谢谢！

Answer 1

你可以这样做

$('#input').bind('focus blur', function() {
    $('#div').toggle();
})

在http://jsfiddle.net/u9xwb/查看工作示例

Answer 2

你是对的，它只会杀死你订阅的事件，你需要在输入时停止点击事件。

$('#input').focus( function(e){  
   e.stopPropagation();  
   $('#div').show();
}).click( function(e){  
   e.stopPropagation();
});

$(document).click( function(){  
   $('#div').hide();  
});