在这个模块中，我只想制作一本活页簿(杂志)，所以我在 javascript 数组中拍摄图像，但图像没有加载，而不是显示图像([object"htmlimageelement]="")。我不明白我的代码中缺少什么。我确定我的图像目录是正确的。我想我的 javascript 文件中缺少一些东西。
HTML:
<html>
<head>
<title>Flipbook</title>
<link href="jqmodule.css" type="text/css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jqmodule.js" type="text/javascript"></script>
<script src="jquery.easing.1.3.js" type="text/javascript"></script>
<script src="jquery.booklet.latest.js" type="text/javascript"></script>
</head>
<body class="body_div">
<div class="container">
<div class="main clearfix">
<div class="custom_wrapper">
<h3>Flipbook</h3>
<div id="mybook" class="booklet"></div>
</div>
</div>
</div>
</body>
</html>
JS:
var heading=['background-size','Using transform and the transform functions','Audio','CSS 1, CSS 2.1, CSS3 ...','The benefits of CSS3'];
var para = new Array();
para[0] = new Image();
para[0].src = 'images/1.jpg';
para[1] = new Image();
para[1].src = 'images/2.jpg';
para[2] = new Image();
para[2].src = 'images/3.jpg';
$(function() {
var str="";
for(var i=0;i<para.length;i++)
{
str+="<div class=\"b-page-blank\"><h1>"+heading[i]+"</h1><img src="+para[i]+"/></div>";
}
$('#mybook').html(str);
$('#mybook').booklet({ name: "Booklet" });
$(".b-counter").click(function(){
if($(this).attr('id')==2||$(this).attr('id')==4)
{
$("#mybook").booklet("next");
}
if($(this).attr('id')==3||$(this).attr('id')==5)
{
$("#mybook").booklet("prev");
}
});
});
最佳答案
我可能会尝试这种方式，更干净，更容易调试，
var data = [
{heading:'background-size',imageSrc:'/images/1.jpg'},
{heading:'Using transform and the transform functions',imageSrc:'/images/2.jpg'},
{heading:'Audio',imageSrc:'/images/3.jpg'}
// ...
];
$(function() {
var str="";
$.each(data,function(index,row){
str+="<div class=\"b-page-blank\"><h1>"+row.heading+"</h1><img src=\""+row.imageSrc+"\" /></div>";
})
$('#mybook').html(str);
//... rest of yoru code
});
希望对你有帮助
关于javascript - 在 javascript 数组中拍摄图像时不显示 img 标签，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45387403/