在一段时间内切换文本

Switch between texts in a span

本文关键字:文本 一段时间      更新时间:2023-09-26

我能够用以下代码替换点击时的文本:

function changetext() {
    document.getElementById("accounts").innerHTML = "Create Account";
}
<span id="accounts" onclick="changetext()">Login</span>

当单击Create Account时,这将用Create Account替换Login,但不会切换回Login。我需要在LoginCreate Account之间切换。

有什么建议吗?

查看文本的基本检查:

function changetext() {
    var div = document.getElementById("accounts");
    var text = div.innerHTML == "Create Account" ? "Login" : "Create Account";
    div.innerHTML = text;
}
<span id="accounts" onclick="changetext()">Login</span>


或者根本没有JavaScript

input[name="log"] { display : none; }
input[name="log"] + label.a {} 
input[name="log"] + label.a + label.b { display:none } 
input[name="log"]:checked + label.a {display:none} 
input[name="log"]:checked + label.a + label.b { display: inline } 
<input type="checkbox" id="log" name="log" /><label class="a" for="log">Text 1</label><label class="b" for="log">2 Text</label>

您需要使用if条件检查innerHTML并更改

function changetext() {
   var element =  document.getElementById("accounts");
   element.innerHTML = (element.innerHTML==="Login") ? "Create Account" : "Login";
}
<span id="accounts" onclick="changetext()">Login</span>

当您单击span标记的内容时,会调用changetext()函数,该函数会将内容更改为"创建帐户"。所以你可以这样做:-

function changetext() {
    if(document.getElementById("accounts").innerHTML == "Login"){
    document.getElementById("accounts").innerHTML = "Create Account";
    }
    else
    {
    document.getElementById("accounts").innerHTML = "Login";
    }
}