Question

有许多拇指图像，我希望模式对话框打开时可以看到全尺寸图像。我想动态地传递＆＃39; src＆＃39; ＆＃39;对话框中的全尺寸图像div＆＃39; src＆＃39;

C＃代码：

        <div id="dialog" title="American Lady Caterpillar">
            <img id="myImage" src="../Images/Caterpillar/Cat_AmericanLady.jpg" style="vertical-align: top; padding: 0px 10px 10px 2px;" />
        </div>


        <table id="cat_tbl">
            <tr>
                <td class="cat_colwidth">
                    <img class="imgLink" src="../Images/Caterpillar/Cat_AmericanLady_Thumb.jpg" style="float:left; padding: 0px 10px 10px 2px;" />
                    <span class="cat_bold">Genus</span>:  Vanessa &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <span class="cat_bold">Species</span>: virginiensis <br />
                    <span class="cat_bold">Common Name: American Lady<br />
                    <span class="cat_bold">Group</span>:</span> Brushfoots<br />
                    <span class="cat_bold">Host Plants</span>: Sweet everlasting, Pearly everlasting, Plantain-leaved pussy toes, and Ironweed 
                </td>
            </tr>
            <tr>
                <td class="cat_colwidth">
                    <img class="imgLink"  src="../Images/Caterpillar/Cat_Viceroy_Thumb.jpg" style="float:left; padding: 0px 10px 10px 2px;" />
                    <span class="cat_bold">Genus</span>:  Limenitis &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <span class="cat_bold">Species</span>: archippus<br />
                    <span class="cat_bold">Common Name</span>:<br />
                    <span class="cat_bold">Group</span>: Admirals<br />
                    <span class="cat_bold">Host Plants</span>: Trees in the willow family including Willows, and Poplars and Cottonwoods
                </td>
            </tr>
</table>

Jquery - 到目前为止：

<script>
    $(document).ready(function() {
        $('#dialog').dialog({ autoOpen: false })
        $('.ui-dialog').css({
            width  : 600,
            height: 450})
        $('.imgLink').click(function () {
            $('#myImage').attr('src', imgSrc);
            $('#dialog').dialog('open').css({
                width: 600,
                height: 450
            });
        });
    });
</script>

Answer 1

如果你的代码只是这个，那么问题出在这里：

$('#myImage').attr('src', imgSrc);

更改为：

$('#myImage').attr('src', $(this).attr('src').replace('_Thumb', ''));

jquery模态对话框打开图像onclick与多个图像

1 个答案: