我正在尝试编写一个简单的JS函数,该函数每1秒随机旋转一个CSS块的背景图像。 我想添加块的名称和参数的图像数量,因此函数可以尽可能灵活,我可以在一个页面上调用它的多个实例。 问题是我得到' nameofparamter undefined'错误。
这是带有HTML的脚本
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu-HU" lang="hu">
<head>
<meta name="http-equiv" content="text/html; charset="utf-8"">
<meta name="description" content="leiras"><meta name="keywords" content="kulcsszavak"/>
<style type="text/css">
div#mycontainer{
background-image: url(images/bg_image1.jpg);
width: 800px;
height: 600px;
}
</style>
<script type="text/javascript" charset="utf-8">
function changeBgImage(num, el){
var imageNum = num;
var randomImageNum = Math.ceil(Math.random()*imageNum);
if(el!=='null'){
el.style.backgroundImage='url(images/bg_image'+randomImageNum+'.jpg';
var timer = setTimeout("changeBgImage(num, el)", 1000);
}
}
</script>
</head>
<title>Dynamic Backgroundimage changer</title>
<body onload="changeBgImage(4, document.getElementById('mycontainer'));">
<div id="mycontainer">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut felis purus, dictum quis pellentesque ut, venenatis et tellus. Phasellus gravida cursus urna, quis hendrerit risus rutrum vel. Suspendisse dictum lobortis molestie. Sed quis lacus nec ante dignissim sollicitudin. Curabitur tristique facilisis turpis.
</div>
</body>
</html>
我真的不明白'因为在我调用函数的body的onload事件处理程序中有两个参数的迭代值?那么为什么未定义? 非常欢迎您的帮助! :)
答案 0 :(得分:5)
有很多关于你的代码的事情是不对的。首先,您的空检查仅检查变量没有正好为'null'
的字符串值。在您设置backgroundImage
属性的位置,您指定的字符串具有不匹配的括号。
但最重要的是,setTimeout
在window
上下文中执行,您的变量不可用(您也不希望它们在那里)。而是将您的电话改为
setTimeout(function() { changeBgImage(num, el) }, 1000);
所以完整的解决方案是
if(el){
el.style.backgroundImage='url(images/bg_image'+randomImageNum+'.jpg);';
var timer = setTimeout(function() { changeBgImage(num, el) }, 1000);
}
答案 1 :(得分:1)
变化
setTimeout("changeBgImage(num, el)", 1000);
到
setTimeout(function() { changeBgImage(num, el) }, 1000);
答案 2 :(得分:1)
这是一个猜测,但首先是因为你在引号中调用它在全局上下文中调用它,num
和el
没有在全局上下文中定义,而是在你的函数中定义。尝试使用函数文字,例如
setTimeout( function() { changeBgImage( num, el ) }, 1000 );
PS,你应该使用!= null
而不是字符串null。
答案 3 :(得分:0)
使用setTimeout调用函数时,无法将对象作为参数传递。所以我建议你以其他方式解决问题。 您可以使用共享变量来传递参数。