在页面加载时更改文本和图像

我向我的网站添加了一个报价，我希望每次更改报价。这工作。但是现在我也想添加一个随文本而变化的图片。（它总是必须是具有相同文本的相同图片）。在页面加载时更改文本和图像

我该怎么做？

我的代码：

<script type=text/javascript> 
var delay="10"; //how many seconds you wnat the delay to be 
var count='0'; 
var Texts=new Array(); 
Texts[0]="Je voelt je hier geen nummer, maar eerder een kleine schakel binnen een groot bedrijf"; 
Texts[1]="Hier komt een tweede quote van een medewerker"; 
Texts[2]="Hier komt een derde quote van een medewerker"; 
function changeText(){ 
document.getElementById('quote').innerHTML=Texts[count]; 
count++; 
if(count==Texts.length){count='0';} 
setTimeout("changeText()",delay*1000); 
} 
</script> 
<body onLoad="changeText();"> 
<h3 id="quote"></h3>

感谢名单！ Annelies

来源

2013-07-18 user2594509

包含元素并更改其src属性。 – Sid

Demo

创建<img>元素，改变你的数据结构：

var delay="10"; //how many seconds you wnat the delay to be 
var count=0; 
var Texts = []; 
Texts.push({ image : 'image1.jpg', text : 'Je voelt je hier geen nummer, maar eerder' }); 
Texts.push({ image : 'image2.jpg', text : 'Je voelt je hier' }); 
Texts.push({ image : 'image3.jpg', text : 'Je voelt je hier geen nummer, maa' }); 

function changeText(){ 
    document.getElementById('quote').innerHTML=Texts[count].text; 
    document.getElementById('image').src=Texts[count].image; 
    count++; 
    if(count==Texts.length){count=0;} 
    setTimeout(changeText,delay*1000); 
}

HTML：

<h3 id="quote"></h3> 
<img src="" id="image" />

旁注：

如果愿意创建阵列var Texts = []
通过使用Texts.push()可以追加到数组，而不必每次都
字符串不要传递给setTimeout设置下一个关键的[]语法，传递函数名不带引号或括号。
将count设置为0时，请勿将其包含在引号中，因为它将其设置为字符串。

来源

2013-07-18 08:19:36 MrCode

很多很多，这个作品很棒！ – user2594509

Soemthing这样的...

<script type=text/javascript> 
    var delay="10"; //how many seconds you wnat the delay to be 
    var count='0'; 
    var Texts=new Array(); 
    Texts[0]={ "text" : "Je voelt je hier geen nummer, maar eerder een kleine schakel binnen een groot bedrijf", "img" : "<your img1 path>"}; 
    Texts[1]={ "text" : "Hier komt een tweede quote van een medewerker", "img" : "<your img2 path>"}; 
    Texts[2]={ "text" : "Hier komt een derde quote van een medewerker", "img" : "<your img3 path>"}; 
    function changeText(){ 
     document.getElementById('quote').innerHTML=Texts[count].text; 
     document.getElementById("your_img_tag_id").src = Texts[count].img; 
     count++; 
     if(count==Texts.length){count='0';} 
     setTimeout("changeText()",delay*1000); 
    } 
</script>

来源

2013-07-18 08:20:04 mohkhan

另外一个问题：现在，我每次重装时，它开始与第一图片和报价。有没有办法改变这个？所以，当浏览器加载时，它会选择一个随机图片并引用？

Annelies

来源

2013-07-20 12:32:44 user2594509

在页面加载时更改文本和图像

回答

相关问题