Egz*_*Est 1 html javascript jquery html5 image
我有一个网站,基于en, sq or el,我想要改变图像源的语言.所以我有一个文件夹命名的屏幕截图,然后有三个文件夹:en , sq and el.
例如,名为"slide-phone.png"的图片的网址是:
img/screenshots/en/slide-phone.png
img/screenshots/sq/slide-phone.png
img/screenshots/el/slide-phone.png
在html文本上我有一个参数:{{ _('en') }}可以有其中一个值:en , sq and el.在这种情况下是en.
<html lang="{{ _('en') }}">
<head>
<script type="text/javascript">
img_url = 'img/screenshots/'+"{{ _('en') }}"+'/slide-phone.png';
console.log("img is:" , img_url);
$('#slide-phone-img').attr('src',img_url);
</script>
HTML div是这样的:
<img id="slide-phone-img" src="" >
控制台提供了正确的链接:img is: img/screenshots/en/slide-phone.png但src属性为空!
为什么会发生这种情况,我不明白,有人可以帮助我吗？
根据我的评论,你需要将代码包装在$(document).ready();闭包中.
工作范例:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
<script type="text/javascript">
// When document is loaded
$(document).ready(function()
{
img_url = 'https://www.google.co.uk/logos/doodles/2016/st-davids-day-2016-5676738174517248-hp.jpg';
$('#slide-phone-img').prop('src', img_url);
});
</script>
</head>
<body>
<img id="slide-phone-img" src="" >
</body>
</html>
注意:.prop()vs .attr()(为什么即时使用prop)
| 归档时间： |
|
| 查看次数： |
1176 次 |
| 最近记录： |