簡介
使用jQuery 檢索div 背景圖像的尺寸可能看起來很簡單但也帶來了挑戰。本文解決了這個任務，並提出了一個簡化流程的擴展解決方案。
問題：
查詢：如何取得背景圖片使用 jQuery 調整 div 的大小（寬度和高度）？
回應A:
要擷取背景影像尺寸，請採用以下方法：
var image_url = $('#myDiv').css('background-image'),
image;
// Remove url() or url("")
image_url = image_url.match(/^url\("?(.+?)"?\)$/);
if (image_url[1]) {
image_url = image_url[1];
image = new Image();
// Load image if needed
$(image).load(function () {
alert(image.width + 'x' + image.height);
});
image.src = image_url;
}回應B（20188） :
為了全面解法：
var getBackgroundImageSize = function(el) {
var imageUrl = $(el).css('background-image').match(/^url\(["']?(.+?)["']?\)$/);
var dfd = new $.Deferred();
if (imageUrl) {
var image = new Image();
image.onload = dfd.resolve;
image.onerror = dfd.reject;
image.src = imageUrl[1];
} else {
dfd.reject();
}
return dfd.then(function() {
return { width: this.width, height: this.height };
});
};用法：
getBackgroundImageSize(jQuery('#mydiv'))
.then(function(size) {
console.log('Image size is', size.width, size.height);
})
.fail(function() {
console.log('Could not get size because could not load image');
});以上是如何使用 jQuery 取得 Div 的背景影像尺寸？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
