Jquery Rqin中的多个弹出窗口_Jquery_Html_Popup

Jquery Rqin中的多个弹出窗口

jquery html

Jquery Rqin中的多个弹出窗口,jquery,html,popup,Jquery,Html,Popup,我正在使用query rain创建弹出窗口，但我似乎不明白为什么当我单击按钮以显示第二个窗口时，第一个弹出窗口内容会出现，即使它们具有不同的ID 以下是我正在使用的代码： <body>  <button class="my_popup_open">Open popup</button>  <

我正在使用query rain创建弹出窗口，但我似乎不明白为什么当我单击按钮以显示第二个窗口时，第一个弹出窗口内容会出现，即使它们具有不同的ID

以下是我正在使用的代码：

<body>

<!-- button to open the popup -->
  <button class="my_popup_open">Open popup</button>

  <!-- Add content to the popup -->
<div id="my_popup">

    ...First pop-up...

    <!-- Add an optional button to close the popup -->
    <button class="my_popup_close"></button>

</div>


<!-- button to open the popup -->
  <button class="my_popup_open">Open Second popup</button>

  <!-- Add content to the popup -->
<div id="my_popupTwo">

    ...Pop-up NUMBER TWO...

    <!-- Add an optional button to close the popup -->
    <button class="my_popup_close"></button>

</div>


  <!-- Include jQuery -->
  <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>

  <!-- Include jQuery Popup Overlay -->
  <script src="http://vast-engineering.github.io/jquery-popup-overlay/jquery.popupoverlay.js"></script>

  <script>
    $(document).ready(function() {

      // Initialize the plugin
      $('#my_popup').popup({
        opacity: 0.7,
        transition: 'all 0.3s'
        });

        // Initialize the plugin
      $('#my_popupTwo').popup({
        opacity: 0.7,
        transition: 'all 0.3s'
        });

    });
  </script>


</body>


打开弹出窗口
…第一个弹出窗口。。。
打开第二个弹出窗口
…弹出第二个。。。
$（文档）.ready（函数（）{
//初始化插件
$（“#我的弹出窗口”）.popup({
不透明度：0.7，
过渡：“全部0.3”
});
//初始化插件
$（'my#u popupTwo'）。弹出({
不透明度：0.7，
过渡：“全部0.3”
});
});

非常感谢您的任何建议

这个插件似乎不能处理同一页面上的多个弹出窗口。解决方案是做一些小改动来显示choosen one弹出窗口

试试这个：

<button onclick="$('#my_popup').popup('show');">Open popup</button>

<button onclick="$('#my_popupTwo').popup('show');">Open Second popup</button>

打开弹出窗口
打开第二个弹出窗口

编辑：

关于关闭按钮：）

好主意！除了第二个弹出窗口上的“关闭”按钮外，其他功能都很好。有没有办法做一点小改动，让它发挥作用？

<button onclick="$('#my_popup').popup('hide');"></button>

<button onclick="$('#my_popupTwo').popup('hide');"></button>