如何在外部点击时关闭模式

Question

我想通过单击其中的关闭链接或点击该格外的任何位置来隐藏div。

我想下面的代码，它打开并通过正确点击关闭链接关闭div，但如果我有问题，通过单击div外的任何地方关闭它。

<div id="float_tabs"> 
    <ul> 
    <li><a href="#sign_in"><?= Yii::t('app','Sign in'); ?></a></li> 
    <li> 
     <a href="#register"><?= Yii::t('app','Create an account'); ?></a> 
     <button type="button" class="close" aria-hidden="true" id="open" onclick="$('.floating_box').toggle('.hide_sign_in_box');">×</button> 
     <script src="jquery-1.12.0.min.js"> 
     $(document).ready(function() { 
      $('#close').hide() 
     }); 

     $('#open').on('click', function() { 
      $('#float_tabs').show(500) 
     }); 

     $(document).mouseup(function (e) { 
      var popup = $("#float_tabs"); 
      if (!$('#open').is(e.target) && !popup.is(e.target) && popup.has(e.target).length == 0) { 
      popup.hide(500); 
      } 
     }); 
     </script> 

Answer 1

问题是你不能有一个外部脚本和一个内联脚本在一起。他们需要成为独立的元素。

<script src="jquery-1.12.0.min.js"> 
    $(document).ready(function() { 
    ... 
</script> 

需要是

<script src="jquery-1.12.0.min.js"></script> 
<script> 
    $(document).ready(function() { 
    ... 
</script>