Question

<script language="javascript">

    function changecolor (i)
    {
        if(document.getElementById)
            document.getElementById(i).color = "green";
        else if(document.all)
            document.all[i].color = "red";

        return false;
    }

</script>



<h1>Edit Status: 
    <a href="#" onClick="return changecolor('item1')" class="a">
        <font style="color: #f00;">
            <font id=item1>Disabled</font>
    </a>
</h1><br></font>

我有上面的文字颜色转换器，现在我想用红色创建禁用，当你点击它时文字改变颜色变成绿色，如果你再次点击它会返回..

然后我怎么能这样做？该代码仅在我单击一次并且不更改文本时才起作用。

感谢你们所有人！

Answer 1

您使用了<font> HTML标记，不推荐使用。您应该使用CSS来设置HTML标记的样式。

您可以在此处阅读CSS：W3schools - CSS

我认为这个HTML对您有好处：

<h1>Edit Status: 
    <a href="#" onClick="return changecolor(this)" style="color: red;">Disabled</a>
</h1>

使用此脚本更改文字和颜色：

<script type="text/javascript">

function changecolor(element){
    if (element.innerHTML == "Disabled"){
        element.innerHTML = "Enabled";
        element.style.color = "green";
    } else {
        element.innerHTML = "Disabled";
        element.style.color = "red";
    }
    return false;
}

</script>

Answer 2

让我们看一下HTML元素的嵌套：

<h1>Edit Status: 
    <a href="#" onClick="return changecolor('item1')" class="a">
        <font style="color: #f00;">
            <font id=item1>Disabled</font>
        </a>   <----- bad
    </h1>      <----- bad
    <br>
</font>        <----- bad

我建议：

删除所有<font>标记，因为这不是1997. :)使用CSS
修复元素的嵌套
使用您的固定代码更新您的问题

Answer 3

你的支票很奇怪。我看不到document.getelementById无法使用的情况。

你想要的更像是：

function changecolor (controlID)
{
    var obj = document.getElementById(controlID);

    //switch color and change text conditionally:
    if(obj.color === "green"){
        obj.color = "red";
        obj.innerText = "Disabled";
    } else {
        obj.color = "green";
        obj.innerText = "Enabled";
    }
}

但除此之外，你的HTML格式不正确，所以你应该真的想要纠正它。

Onclick使用标签更改颜色+文本

3 个答案: