如何在Javascript中闪烁20秒后隐藏div或图像？

我正在忙着制作一个记忆游戏，在这个游戏中，一个图像将显示给用户，在图像闪烁大约10秒后，它应该隐藏起来，并显示四个选项供用户选择正确或错误的答案

到目前为止，我所完成的只是加载图像并循环遍历代码可以找到的所有谜题。 我现在要做的是让图像在一段时间后闪烁和隐藏，同时刷新页面的该部分，而不是整个页面

我在页面上使用C#和一个用户控件。 到目前为止，我所尝试的只是

<script> 
var x;
function BlinkImage() {
    x = 1;
    setInterval(change, 2000);
}

function change() {
    if (x === 1) {
        var image = document.getElementById('<%=imgMain.ClientID %>');
        image.visible = false;
        x = 2;
    }
    else {
        var image = document.getElementById('<%=imgMain.ClientID %>');
        image.visible = true;
        x = 1;
    }
}
</script>

var x；
函数BlinkImage（）{
x=1；
设定间隔（变更，2000年）；
}
函数更改（）{
如果（x==1）{
var image=document.getElementById（“”）；
image.visible=false；
x=2；
}
否则{
var image=document.getElementById（“”）；
image.visible=true；
x=1；
}
}

在加载该实例的谜题时（在代码隐藏中）

Page.ClientScript.RegisterStartupScript（游戏类型），“开始”，“BlinkImage（）；”；

在Firefox上调试时，我可以一步一步地完成代码。但我的图像不会闪烁或闪烁。我明白我只是把可视性当作我的“眼罩”。我不知道还能用什么

---

我该怎么做才能使图像闪烁或闪烁20秒，然后在该时间过后隐藏图像？然后在用户做出选择后重复此过程。

使用样式属性，并在可见/隐藏时进行更改

function change() {

var image = document.getElementById('<%=imgMain.ClientID %>');

    //check if visible   
    if (image.style.visibility=="visible") {

       image.style.visibility="hidden";
    }
    else {
       image.style.visibility="visible";
    }
}

;

函数更改（）{
var image=document.getElementById（“”）；
//检查是否可见
if（image.style.visibility==“visible”）{
image.style.visibility=“hidden”；
}
否则{
image.style.visibility=“可见”；
}
}
;

试试这个：

function flashAndHide(img_id){
var img = $("#"+img_id);
var x = 0;
var inter = setInterval(function(){

if(x % 2 == 0){
img.hide();
}else{
img.show();
}
x += 1;
}



},1000);

if(x === 20){
img.hide();
clearInterval(inter);
}

  }

尚未对此进行测试，但它应该可以工作，

您可以尝试以下操作（代码中的注释）：

var blinkInterval=setInterval（change，2000），//将间隔设置为变量
image=document.getElementById（'test'），//用客户端id替换测试：
x=1；
函数更改（）{
如果（x%2==1）{//通过按2修改并获得余数，查看它是奇数还是偶数
image.style.display='none'；
}否则{
image.style.display='block'；
}
x++；//增量x
如果（x==10）{//应该发生10次（即20秒，间隔为2秒）
clearInterval（blinkInterval）；//清除间隔（结束时应隐藏，因为奇数显示为none，我们在运行20之前清除）
}
}

---

test

看起来您正试图使用javascript将asp.net属性

Visible

应用于html对象。那不行。请更改图像css类或直接将样式设置为图像。您可以尝试使用

函数更改（）{img=document.getEl..；img.opacity=x；x=（x==1？0:1）；}

抱歉，我这样做是不明智的，但我如何在代码中调用这些？将其添加到页面的脚本块中，或者如果它位于外部js文件中，只要确保js文件包含在页面中，我就得到一个例外。typeerror，图像为空。为了使var映像正常工作，我将进行一些讨论。我不确定是否仍然是这样，但有时对于本机js函数，您需要在元素插入dom后包含脚本-您可以尝试在结束正文标记之前包含脚本，谢谢。我将它移动到我控件底部的一个单独的脚本标记中，就像一个符咒。现在将四处玩以加快速度。

function flashAndHide(img_id){
var img = $("#"+img_id);
var x = 0;
var inter = setInterval(function(){

if(x % 2 == 0){
img.hide();
}else{
img.show();
}
x += 1;
}



},1000);

if(x === 20){
img.hide();
clearInterval(inter);
}

  }