1

嗨，我正在使用 jQuery Lightbox Me 插件在页面上打开一个弹出窗口，但我希望多个链接打开同一个弹出窗口。

编码：

<script src="./pop_files/jquery.lightbox_me.js" type="text/javascript" charset="utf-8"></script>
<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();
        });
        $('#try-2').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>
<link rel="stylesheet" href="./pop_files/styles.css" type="text/css" media="screen" title="no title" charset="utf-8">

链接：

<a href="./pop_files/pop.htm" id="try-1">Open pop link 1</a>
<a href="./pop_files/pop.htm" id="try-2">Open pop link 2</a>

我遇到的问题是，我需要给每个链接一个新的 (id="try-...") 以使其正常工作，这对于 2 个链接来说很好，但我认为前 50 个链接有点不必要。

必须有一种更简单的方法来做到这一点，所以任何想法都非常受欢迎。

问候凯文。

4

2 回答 2

1

尝试使用类而不是 id。给所有链接相同的类：

$('.try').click(function(){
    //some code...
})
于 2012-08-15T12:49:28.773 回答
0

您可以使用jQuery Selector来执行此操作，如下所示：

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

        $('a[id^="try"]').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>
<link rel="stylesheet" href="./pop_files/styles.css" type="text/css" media="screen" title="no title" charset="utf-8">

这也可以解决您的问题超过 100 秒，我希望这会有所帮助

于 2012-08-15T12:52:54.557 回答