1

我正在尝试获取一个链接以更改每次单击 javascript innerHTML。

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    }
    if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

 

<a id="id" href="javascript:id_1('id')">innerHTML1</a>

当您单击链接时，我希望它从innerHTML1toinnerHTML2变为innerHTML1toinnerHTML2等等。

现在它只是从innerHTML1到切换一次innerHTML2

4

4 回答 4

4

您需要使用else if第二个 if 语句。

您的代码中的逻辑在第二次单击时（当内容为 innerHTML2 时）如下所示：

  1. 第一个 if 语句测试内容是否为 innerHTML2，因此将内容更改为 innerHTML1（您想要的）。
  2. 第二个 if 语句测试内容是否为 innerHTML1，它是（因为它只是在步骤 1 中更改）所以内容被更改回 innerHTML1（不是您想要的）。

所以解决方案应该如下所示：

function id_1(a){
    var id = document.getElementById(a); 
    if (id.innerHTML=="innerHTML2"){
        id.innerHTML="innerHTML1";
    }else if (id.innerHTML=="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

为了强调这一点，您可以保持代码不变，但使用 return 来确保只使用一个 if 语句。

function id_1(a){
    var id = document.getElementById(a); 
    if (id.innerHTML=="innerHTML2"){
        id.innerHTML="innerHTML1";
        return;
    }

    if (id.innerHTML=="innerHTML1"){
        id.innerHTML="innerHTML2";
        return;
    }
}
于 2013-03-07T20:49:14.800 回答
3

你只需要else在你的if陈述之间使用一个：

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    } else if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

没有第二个，else您的第二个if会受到第一个更改的影响if。

由于 innerHTML 只有两种状态，您实际上可以简化为：

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    } else {
        id.innerHTML="innerHTML2";
    }
}
于 2013-03-07T20:49:30.923 回答
1

它实际上一直在切换，但正如你所写的那样，它切换到“innerHTML1”，然后又回到“innerHTML2”

所以只需将第二个“if”更改为“else if”

<html>
<head>
<script>
function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
    id.innerHTML="innerHTML1";
    }
    else if (id.innerHTML==="innerHTML1"){
    id.innerHTML="innerHTML2";
    }
}
</script>
</head>
<body>
<a id="id" href="javascript:id_1('id')">innerHTML1</a>
</body>
</html>
于 2013-03-07T20:53:44.443 回答
1

您只是缺少一个 else：

<html>
<head>
<script>
function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    }
    else if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }

}
</script>
</head>
<body>
<a id="id" href="javascript:id_1('id')">innerHTML1</a>
</body>
</html>

小提琴：http: //jsfiddle.net/WCgAS/

于 2013-03-07T20:50:17.920 回答