没有点击的第一张图片

Posted 2023-02-24

【中文标题】没有点击的第一张图片

【英文标题】：First image without click

【发布时间】：2016-08-13 20:43:43

【问题描述】：

我的图片库有问题。当我单击缩略图时，它可以工作并显示大图像，但我希望显示第一张图像而无需单击其缩略图。 我怎么解决这个问题？ 下面是我的代码。

这是我的 Django 模板：

<div class="row">
    % if offer_images1 %
        <div class="col-md-6 col-sm-6 col-xs-12" id="help">
            % for image in offer_images1 %
                <img id="imageHere" class="zoom_01 img-responsive" data-zoom-image=" image.paint.url " />
            % endfor %
        </div>

        <div class="col-md-6 col-sm-6 col-xs-12">
            <i><b>% trans "Title" %: </b> offer_gallery.title </i><br>
            <i><b>% trans "Status" %: </b> offer_gallery.status </i><br>
        </div>

                % for image in offer_images1 %
                    <div class="col-md-3 hover08 column">
                        <div style="padding-top:20px;padding-bottom:20px;">
                            <figure class="img1">
                                <img class="thumb img-responsive" src=" image.paint.url "   style="border:1px solid grey">
                            </figure>
                        </div>
                    </div>
                    % if forloop.counter|divisibleby:"4" and not forloop.last %
                        </div><div class="row">
                    % endif %
                % endfor %

    % endif %
</div>

这是我的 jQuery 代码：

<script>
    $(document).ready(function () 
        $( ".thumb" ).each(function(index) 
            $(this).on("click", function()
                var image = $(this).attr("src")
                $("#imageHere").attr('src', image);
            );
        );
    );
</script>

【参考方案1】：

自己在第一张图片上触发 click 事件。

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

        $(".thumb").on("click", function()
            $("#imageHere").attr('src', $(this).attr("src"));
        );

        // ======= HERE =======
        $( ".thumb:first" ).click();

    );
</script>

【讨论】：

甚至更简单...).eq(0).click();

@RokoC.Buljan (+1)。我喜欢单行：）马克，考虑选择答案来标记你的问题关闭。

@Uzbekjon 我看到你期待一个漂亮的绿色 checky，所以，就像我提醒你，OP 可以使用更多代表（对赏金等有用） ，所以如果您发现 Q 格式正确，您可以先展示一些运动精神！ ;)