簡體   English   中英

jQuery:img.src更改

[英]JQuery: img.src change

我正在嘗試建立這個簡單的圖庫,而且Chrome的安全性似乎不支持嵌入式jquery(它在IE上有效)。 (當我單擊.mini類圖像時,我希望.show類圖像將其復制為src)。 因此,我需要編寫一個.js文件。 我就是無法正常工作。 有什么建議嗎? 我為我的英語不好對不起。

HTML:

<div class="galerie" align="center">
        <div class="mini">
            <img onClick="show1.src=imag01.src" id="imag01" src="img/pers/img1.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag02.src" id="imag02" src="img/pers/img2.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag03.src" id="imag03" src="img/pers/img3.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag04.src" id="imag04" src="img/pers/img4.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag05.src" id="imag05" src="img/pers/img5.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag06.src" id="imag06" src="img/pers/img6.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag07.src" id="imag07" src="img/pers/img7.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag08.src" id="imag08" src="img/pers/img8.jpg" alt="NO IMAGE"/>
            <img onClick="show1.src=imag09.src" id="imag09" src="img/pers/img9.jpg" alt="NO IMAGE"/>
        </div>  
        <div class="show" align="center">
           <img id="show1" src="img/img1.jpg" alt="NO IMAGE"/>
        </div>
</div>

CSS:

<style type="text/css">
            .mini img {
                height: 80px;
                border: 4px solid #C3C3C3;
                padding: 1px;
                margin: 0 10px 10px 0;
            }

            .mini img:hover {
                border: 4px solid #B08FAB;
                cursor:pointer;
            }

            .show img {
                border: 4px solid #C3C3C3;
                padding: 1px;
                height: 400px;
            }
            div.galerie{
                box-shadow: 0px 3px 10px #243139;
                z-index: 5;

            }
</style>

jQuery (不起作用)

$(".mini img").click(function(){
            var imgsrc = jQuery(this).attr("src");
            $("#show1").attr("src", imgsrc);
});
jQuery("#show1 img").attr("src") = imgsrc;

^^不是jQuery的工作方式。 完全沒有

jQuery("#show1 img").attr("src", imgsrc);

^^是jQuery的工作方式。

jQuery .attr()文檔

編輯:您的選擇器也是錯誤的。 #show1是一張圖片。 因此,您應該執行以下操作:

jQuery("#show1").attr("src", imgsrc);

EDIT2:...並且您正在獲取imgsrc的第一張圖片的src,而不是被單擊的圖片。 使用this

var imgsrc = jQuery(this).attr("src");

甚至

var imgsrc = this.src;

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM