时间戳

首页 > 解决方案 > 从 mysql 获取的花药值闪烁的问题

javascript - 从 mysql 获取的花药值闪烁的问题

问题描述

我在闪烁从 mysql 获取的值的文本框时遇到问题，其中只有一个闪烁，但我想闪烁所有这些值。我的PHP代码如下：

 $runquery=mysql_query($qouery,$conn);
 $runquery2=mysql_query($updatepic,$conn);
    while($rows2=mysql_fetch_array($runquery)){
        $coursename3=$rows2['course'];
        echo '<div style="float:right;margin-right:10px">';
 echo "<a class='startexam' id='paymentBlink' href='pay.php?sendnamecourse=$coursename3'>Pay:</a>";
echo "&nbsp&nbsp".$rows2['course'];
echo '</div>';
}

我的Javascript代码如下：

var blink=document.getElementById('paymentBlink');
for(var i=0;i<blink.lenght;i++){
window.addEventListener("load", function() {

setInterval(function() {
    
    blink[i].style.display = (blink[i].style.display == 'none' ? '' : 'none');
    }, 1000);

 }, false);
 }

标签： javascriptmysqldom-events

解决方案

尽管它mysql_已被弃用（这意味着您应该使用MySQLior更改所有服务器端代码PDO）。

更改您的PHP代码以创建唯一 ID，如下例所示。

$runquery=mysql_query($qouery,$conn);
$runquery2=mysql_query($updatepic,$conn);
$i = 0;
while($rows2=mysql_fetch_array($runquery)){
    $coursename3=$rows2['course'];
    echo '<div style="float:right;margin-right:10px">';
    echo "<a class='startexam' id='paymentBlink".$i."' href='pay.php?sendnamecourse=$coursename3'>Pay:</a>";
    echo "&nbsp&nbsp".$rows2['course'];
    echo '</div>';
    $i++;
}

不要Javascript用于闪烁效果CSS。

检查下面的示例片段，使用CSS动画并nth-of-type在元素的索引上添加自定义延迟。

[id^="paymentBlink"] {
  animation-name: blink;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}
[id^="paymentBlink"]:nth-of-type(2n) {
  animation-delay: 0.1s;
}

[id^="paymentBlink"]:nth-of-type(2n+1) {
  animation-delay: 0.2s;
}

@keyframes blink {
  from {opacity: 0;}
  to {opacity: 1;}
}
<div id="paymentBlink1">div 1</div>
<div id="paymentBlink2">div 2</div>
<div id="paymentBlink3">div 3</div>

推荐阅读