JQuery改變圖像

嗨，我有這個問題：當在選擇字段中選擇一個值時，圖像的「src」屬性被改變。我需要獲取該圖像的後，通過jQuery更改後的src值。JQuery改變圖像

我這樣做：

jQuery(document).ready(function($) { 

    $('.woocommerce-main-image img').on('change', function() { 
     var a = $('.woocommerce-main-image img').attr('src'); 
    }); 
});

但這種方式，我得到了SRC之前變化。如何在更改後獲取src值？

來源

2017-10-18 user8060797

「變化」不是「」元素的有效事件。實際上，當您在代碼的另一部分中修改src屬性時，實際上是在元素元素上激發自定義事件，然後您可以簡單地收聽此自定義事件。你能向我們展示src'屬性被操縱的代碼嗎？ – Terry

由於當您在'select'字段中更改選擇並假設這是用JavaScript完成時，您正在更改'src'值，爲什麼不簡單地在那裏添加您的代碼？你已經有了'src'的新值。 –

而不是change您應該正在收聽load事件。

根據MDN：

此事件處理程序將在圖像加載完畢的圖像元素上調用。這適用於圖像是通過src屬性還是使用list-style-image樣式屬性應用的。如果您更改圖像，則新圖像加載時，事件將再次觸發。這個事件不會冒泡元素樹。

$("#img1").on("load", function(){ 
 
    console.log($(this).attr('src')); 
 
}); 
 

 
setTimeout(function() { 
 
    $("#img1").attr("src", "//placehold.it/200"); 
 
},5000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<img src="//placehold.it/150" id="img1" />

來源

2017-10-18 08:04:14 Nisarg

可以使用load事件

$('.woocommerce-main-image img').on('load', function() { 
    alert($(this).attr('src')); 
});

檢查this link瞭解更多信息

來源

2017-10-18 08:05:18

你應該嘗試使用，而不是全局選擇當前對象，像這樣：

jQuery(document).ready(function($) { 

    $('.woocommerce-main-image img').on('change', function() { 

    var a = $(this).attr('src'); 

    });

}）;

來源

2017-10-18 08:08:21

JQuery改變圖像

回答

相關問題