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

发布于 2024-10-28 09:55:01 字数 508 浏览 3 评论 0原文

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

<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）

谢谢！

原文

I have a tag, and when 'focused' I display a . When I click on the document body I would like this to close. However, this doesn't seem to work when using two different event types:

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

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

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

It appears that the e.stopPropagation() only stop propagation of the 'onfocus' event. Since when I switch the code to be: $('#input').click(), then it works fine.

Just curious if there is anyway to make this work with the above code? (would like to know JS a bit better)

Thanks!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

心如荒岛 2024-11-04 09:55:01

您可以简单地

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

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

You can simply do this

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

Check working example at http://jsfiddle.net/u9xwb/

回复收藏 0 原文

如果没有你 2024-11-04 09:55:01

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

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

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

You're right, it only kills the event you are subscribed to, you need to stop the click event as well on the input.

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

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

回复收藏 0 原文

~没有更多了~