Question

我正在尝试在同一页面上创建一个包含多个弹出窗口的页面。我希望第一个弹出窗口在页面加载时打开，我可以使用

<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.lightbox_me.js" type="text/javascript" charset="utf-8"></script> 
<script type="text/javascript" > 
$(document).ready(function(){ 
  $("#sign_up").lightbox_me({centered: true, onLoad: function() { $('#sign_up').find ('input:first').focus()}});
}); // document ready 

</script> 

<body onload="$('#sign_up').trigger('click');">

但是我希望用户能够点击该弹出窗口中的链接，该链接将保留在同一页面上但打开一个不同的弹出窗口。再次从第二个弹出窗口我想让用户能够点击一个链接打开第三个弹出窗口。

使用此代码我可以点击第一个弹出窗口中的链接（sign_up）单击此处打开第二个弹出窗口（sign1）但第一个弹出窗口仍然落后（我可以看到它，因为第二个弹出窗口较小）

<script type="text/javascript" charset="utf-8">
    $(function() {
        function launch() {
             $('#sign_up').lightbox_me({centered: true, onLoad: function() { $('#sign_up').find('input:first').focus()}});
        }

        $('#try-1').click(function(e) {
            $("#sign_up").lightbox_me({centered: true, onLoad: function() {
                $("#sign_up").find("input:first").focus();
            }});

            e.preventDefault();
        });


        $('table tr:nth-child(even)').addClass('stripe');
    });
</script>
<script type="text/javascript" charset="utf-8">
    $(function() {
        function launch() {
             $('#sign1').lightbox_me({centered: true, onLoad: function() { $('#sign1').find('input:first').focus()}});
        }

        $('#try-2').click(function(e) {
            $("#sign1").lightbox_me({centered: true, onLoad: function() {
                $("#sign1").find("input:first").focus();
            }});

            e.preventDefault();
        });


        $('table tr:nth-child(even)').addClass('stripe');
    });
</script>

我对jquery很新，并且基本上一直试图复制和调整当前的代码，但没有任何乐趣。

lightbox_me - 在同一页面上打开不同的弹出窗口

0 个答案: