Javascript 打开和关闭浮动层相同的链接？_Javascript_Html_Css_Layer_Floating

Javascript 打开和关闭浮动层相同的链接？

javascript html css

Javascript 打开和关闭浮动层相同的链接？,javascript,html,css,layer,floating,Javascript,Html,Css,Layer,Floating,我有一个通过此链接激活的浮动层： <a href="javascript:ToggleFloatingLayer('FloatingLayer',1);"> BUTTON </a> 这是浮动层： <div id="FloatingLayer"> <div id="closeX"> <a href="#" onClick="ToggleFloatingLayer('FloatingLayer',0);return f

我有一个通过此链接激活的浮动层：

<a href="javascript:ToggleFloatingLayer('FloatingLayer',1);"> BUTTON </a>

这是浮动层：

<div id="FloatingLayer">
           <div id="closeX"> <a href="#" onClick="ToggleFloatingLayer('FloatingLayer',0);return false">x</a>
           </div>

剧本：

<script language="JavaScript1.2">

      function ToggleFloatingLayer(DivID, iState) // 1 visible, 0 hidden
      {
        if(document.layers)    //NN4+
        {
           document.layers[DivID].visibility = iState ? "show" : "hide";
        }
        else if(document.getElementById)      //gecko(NN6) + IE 5+
        {
            var obj = document.getElementById(DivID);
            obj.style.visibility = iState ? "visible" : "hidden";
        }
        else if(document.all)   // IE 4
        {
            document.all[DivID].style.visibility = iState ? "visible" : "hidden";
        }
      }
    </script>


函数ToggleFloatingLayer（DivID，iState）//1可见，0隐藏
{
if（document.layers）//NN4+
{
document.layers[DivID]。可见性=iState？“显示”：“隐藏”；
}
else if（document.getElementById）//gecko（NN6）+IE 5+
{
var obj=document.getElementById（DivID）；
obj.style.visibility=iState？“可见”：“隐藏”；
}
else if（document.all）//IE 4
{
document.all[DivID].style.visibility=iState？“可见”：“隐藏”；
}
}

我想“按钮”打开和关闭这个浮动层。因此，它在同一链接中打开和关闭。但现在我只能通过“closeX”来关闭它。我该怎么做？

是标准的跨浏览器和功能丰富的JavaScript库
在应用程序中学习和使用jQuery是所有业务应用程序中最好的这里是api和学习网站的链接

下面是为您准备的片段

<!DOCTYPE html>
<html>

<head>
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script>
    function toggleFloatingLayer(divID) {
      $("#" + divID).toggle();//its only single line to manage toggling for all browsers
    }
  </script>
</head>

<body>

  <a href="#" onclick="toggleFloatingLayer('FloatingLayer')"> BUTTON </a>

  <div id="FloatingLayer" style="display:none;border:solid 2px silver;">
    <div id="closeX" style="background:#efefef"> <a href="#" onClick="toggleFloatingLayer('FloatingLayer')">x</a>
    </div>
    <div>
      Test content of Floating layer
    </div>
  </div>

</body>

</html>


函数切换floatinglayer（divID）{
$（“#”+divID）.toggle（）；//这是管理所有浏览器切换的唯一一行
}
浮层试验内容

使用jQuery管理跨浏览器问题非常容易。请不要这样使用jQuery。了解并了解如何使用它将视图与应用程序逻辑解耦@尼顿菲尔：谢谢你的通知：）我喜欢活动代表团的特色。仅供参考…在上面的代码片段中，没有使用jQuery完成事件附件。本例的目的是以最小的努力和jQuery的引入来解决这个问题。