無法獲取圖像的來源

我想要獲取圖像的來源以便在更大的圖像中使用，問題在於它只是說它在未定義時是未定義的。這是我的代碼，我很感激提前的幫助。無法獲取圖像的來源

編輯它出現在代碼完美的作品中的代碼片段而不是在這裏當我打開索引文件;！（我不知道爲什麼會這樣... HALP我d :,也，當我檢查我自己的index.html文件中的元素，它說，源等於未定義

var src = $('.button').attr('src'); 
 
$(document).ready(function() { 
 
    $('.button').click(function() { 
 
    $('.backdrop').animate({ 
 
     'opacity': '.5' 
 
    }, 300, 'linear'); 
 
    $('.box').animate({ 
 
     'opacity': '1.00' 
 
    }, 300, 'linear'); 
 
    $('.box, .backdrop').css('display', 'block'); 
 
    $('.box').html('<img class="boximg" src="' + src + '">'); 
 
    }); 
 
}); 
 

 
$(document).ready(function() { 
 
    $('.backdrop').click(function() { 
 
    close_box(); 
 
    }); 
 

 
    $('.close').click(function() { 
 
    close_box(); 
 
    }); 
 
}); 
 

 
function close_box() { 
 
    $('.backdrop, .box').animate({ 
 
    'opacity': '0' 
 
    }, 300, 'linear', function() { 
 
    $('.backdrop, .box').css('display', 'none'); 
 
    }); 
 
}

.backdrop { 
 
    position: absolute; 
 
    display: none; 
 
    top: 0px; 
 
    left: 0px; 
 
    background-color: #000; 
 
    opacity: 0; 
 
    height: 100%; 
 
    width: 100%; 
 
} 
 
.box { 
 
    position: absolute; 
 
    display: none; 
 
    background-color: white; 
 
    opacity: 0; 
 
    top: 10%; 
 
    left: 10%; 
 
    width: 80%; 
 
    height: 80%; 
 
    border-radius: 13px; 
 
} 
 
.close { 
 
    float: right; 
 
    margin-right: 5px; 
 
} 
 
.boximg { 
 
    position: absolute; 
 
    top: 3%; 
 
    left: 2%; 
 
    width: 96%; 
 
    height: 94%; 
 
} 
 
.button { 
 
    border-radius: 30px; 
 
    height: 300px; 
 
    width: 300px; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
 
    <script type="text/javascript" src="javascript.js"></script> 
 
</head> 
 

 
<body> 
 
    <img class="button" src="http://www.hdbackgroundpoint.com/wp-content/uploads/2013/10/13/urlttr.jpeg"> 
 
    <div class="backdrop"></div> 
 
    <div class="box"> 
 

 
    </div> 
 
</body> 
 

 
</html>

來源

2014-10-26 user3910313

你會需要弄清楚小提琴和真實代碼之間的不同之處。如果不能看到有什麼不同，潛在的回答者將會很困難。 – 2014-10-26 17:11:27

交換這兩個語句！ 'var src = $（'。button'）。attr（'src'）; $（document）.ready（function（）{' - 在頁面加載之前，圖像不存在 – mplungjan 2014-10-26 17:18:20

您設置var src = $('.button').attr('src'); DOM加載之前，因此沒有定義。

嘗試內$(document).ready()

$(document).ready(function() { 
    var src = $('.button').attr('src'); 

    ... 

});

來源

2014-10-26 17:19:40

由於移動它來一個評論，我想通了，我不得不擁有的document.ready函數內使用var：d

來源

2014-10-26 17:21:03 user3910313

無法獲取圖像的來源

回答

相關問題