2016-04-07 10 views
1

Ich arbeite an einer Website und hier ist der Link file: /// D:/fahim/HTML/menu/index.html. Wenn du auf das Menü klickst, schließt es auf seinem eigenen "X" Knopf, aber ich möchte es schließen, indem du außerhalb des Menüs klickst. Dies ist das Javascript, das auf der Homepage verwendet wird.Schließen Sie ein Menü an beliebiger Stelle

<script> 
 
var popupView = new popup(); 
 

 
document.querySelector('#btn_1').addEventListener('click', function() { 
 
popupView.show(document.querySelector('#popup_1')); 
 
}); 
 

 
document.querySelector('#btn_2').addEventListener('click', function() { 
 
popupView.show(document.querySelector('#popup_2'), function() { 
 
\t console.log('show do something'); 
 
}); 
 
}); 
 

 
document.querySelector('#btn_3').addEventListener('click', function() { 
 
popupView.show(document.querySelector('#popup_3'), '', function() { 
 
\t console.log('CLOSE'); 
 
}); 
 
}); 
 

 
</script>

Und dies ist der Code, der als popup_view.js Datei auf dem Server verbunden ist

(function() { 
 
    var popup = function() { 
 
     function hide(dom, dosomething) { 
 
      if (!dom) { 
 
       console.error('hide function not set dom object'); 
 
       return; 
 
      } 
 
      if (dosomething) { 
 
       dosomething(); 
 
      } 
 
      dom.className += ' ' + 'popup_hide'; 
 
     } 
 
     function show(dom, dosomethingShow, dosomethingClose) { 
 
      if (!dom) { 
 
       console.error('show function not set dom object'); 
 
       return; 
 
      } 
 
      if (dosomethingShow) { 
 
       dosomethingShow(); 
 
      } 
 
      var className = 'popup_hide', 
 
       reg = new RegExp('(^|\\b)' + 
 
        className.split(' ').join('|') + 
 
        '(\\b|$)', 'gi'); 
 
      dom.className = dom.className.replace(reg, '').trim(); 
 
      var nodes = dom.childNodes; 
 
      for (var i = nodes.length - 1; i >= 0; i--) { 
 
       if (nodes[i].className === 'pop_up_close') { 
 
        var close = function (e) { 
 
         if (dosomethingClose) { 
 
          dosomethingClose(); 
 
         } 
 
         dom.className += ' ' + 'popup_hide'; 
 
         nodes[i].removeEventListener('click', close); 
 
        }; 
 
        nodes[i].addEventListener('click', close); 
 
        break; 
 
       } 
 
      } 
 
     } 
 
     this.show = show; 
 
     this.hide = hide; 
 
    }; 
 
    window.popup = popup; 
 
})();

Bitte helfen, wie ich viele Codes versucht haben, außer diesen aber nicht von ihnen funktioniert

+0

'$ (document) .auf ('Klick', HIDE_IT)' und Stop-Event-propogation! – Rayon

+0

Ich bin ein wenig schwach in Javascript, können Sie mir bitte sagen, wo ich es setzen soll, ich meine, ich muss diesen Code in meinem aktuellen Javascript ändern und setzen oder ich muss es separat setzen? – fahim

Antwort

1

$(document).on('click', function(e){ //your close function e.stopPropagation(); } Setzen Sie diesen Code überall in Ihrem $(document).ready( ... blockieren

Verwandte Themen