当 HTML 元素从 AJAX 中出现时，我如何执行 javascript 函数。这是我的想法，但是它不执行blink:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Node JS</title>
<style type="text/css">
html , body {
font: normal 0.9em arial , helvetica;
}
</style>
<script src="http://0.0.0.0:3000/socket.io/socket.io.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
var a=0;
function blinkColor()
{
document.getElementById("red").style.background="red"
setTimeout("setblinkColor()",500)
}
function setblinkColor()
{
a++;
if (a<4){
document.getElementById("red").style.background=""
setTimeout("blinkColor()",500)
}
else{
document.getElementById("red").style.background=""
}
}
$(document).ready(function() {
var socket = io.connect('http://0.0.0.0:3000');
var out = "";
socket.on('populate', function(data) {
$.each(data, function(i, obj) {
if(obj['Ping'] == "FALSE"){
out += "<li id='red'><font color='red'>"+obj.Vardas+" is down..."+obj.Data+"</font></li>";
}
else{
out += "<li><font color='green'>"+obj.Vardas+" is up......."+obj.Data+"</font></li>";
}
});
$('#database').html(out);
});
});
</script>
</head>
<body onload = "blinkColor()">
<div style="float:right; overflow:scroll; height: 400px; width: 30%">
<ul id ='database'></ul>
</div>
</body>
</html>
从套接字加载数组，获取值并生成 html 列表对象。列表已生成，但我希望当元素出现时它会闪烁几秒钟。我需要为此调用 blinColor() 函数。
我添加了 test.html 来使用 getElementsByClass 调用元素，但它不起作用......似乎很简单:
<html>
<head>
<script>
var a=0;
function blinkColor()
{
document.getElementsByClass('blink').style.background="red"
setTimeout("setblinkColor()",500)
}
function setblinkColor()
{
a++;
if (a<4){
document.getElementsByClass('blink').style.background=""
setTimeout("blinkColor()",500)
}
else{
document.getElementsByClass('blink').style.background=""
}
}
</script>
</head>
<body onload="blinkColor()">
<h1 class="blink">Hello World!</h1>
<p class="blink">Hello World!</p>
</body>
最佳答案
您的代码存在几个问题:
- getElementsByClass 应为 getElementsByClassName
- 背景应该是backgroundColor
示例代码:
var blinks=document.getElementsByClassName('blink');
for (var i=0,blinksCount=blinks.length;i<blinksCount;i++) {
blinks[i].style.backgroundColor="red";
}
关于javascript - 元素加载时执行 javascript 函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13553448/