5

リンクをクリックすると #subscribe-pop div を表示し、その外側をクリックすると非表示にしようとしています。以下を変更すると、表示と非表示を切り替えることができます。

$('document').click(function() {

に

$('#SomeOtherRandomDiv').click(function() {

HTML:

<div id="footleft">
    <a href="#" onclick="toggle_visibility('subscribe-pop');">Click here to show div</a>
    <div id="subscribe-pop"><p>my content</p></div>
</div>

脚本：

<script type="text/javascript">
    function toggle_visibility(id) {
        var e = document.getElementById("subscribe-pop");
        if(e.style.display == 'block')
            e.style.display = 'none';
        else
            e.style.display = 'block';
        }
    }

    $('document').click(function() {
        $('#subscribe-pop').hide(); //Hide the menus if visible
    });

    $('#subscribe-pop').click(function(e){
        e.stopPropagation();
    });
</script>
4

3 に答える 3

14

親要素がイベントがトリガーされたことに気付かないように、コンテナー (この場合は「footleft」) でのイベントの伝播を停止する必要があります。

このようなもの：

HTML

 <div id="footleft">
    <a href="#" id='link'>Click here to show div</a>
    <div id="subscribe-pop"><p>my content</p></div>
 </div>

JS

 $('html').click(function() {
    $('#subscribe-pop').hide();
 })

 $('#footleft').click(function(e){
     e.stopPropagation();
 });

 $('#link').click(function(e) {
     $('#subscribe-pop').toggle();
 });

ここで動作することを確認してください。

于 2013-04-24T14:06:34.123 に答える
-1

に変更$(document).click()すると$('html').click()、主な問題が解決するはずです。

第二に、関数はまったく必要ありません。次のようtoggle_visibility()に簡単に実行できます。

$('#subscribe-pop').toggle();

参照:この回答に従って変更されました:body要素の外側のクリックを検出するにはどうすればよいですか?html

于 2013-04-24T13:49:24.917 に答える