0

我试图弄清楚如何使用下拉菜单更改网页的文本颜色,我已经设法使用下拉菜单成功更改背景颜色,该下拉菜单是以下代码:

谁能告诉我如何做到这一点?

4

2 回答 2

0

更改<body>元素的文本颜色:

document.body.style.color="#"+backGround.options[backGround.selectedIndex].value

演示

于 2013-03-21T18:52:27.300 回答
0

首先,将你的 javascript 移到一个单独的函数中(这只是一个很好的做法,并且更容易阅读/更新)并设置你的 onChange(); 调用该函数,并将 select 的值传递给它。

然后把你的函数写成这样:

<html>
    <head>
        <script type="text/javascript">
            function updateTextColour(value) {
                document.body.style.color = '#' + value;
            }
        </script>
    </head>
    <body>
        <form>Change the background color:
            <select name="backGround" size="1" onChange="updateTextColour(this.value)">
                <option value="000000">[Black]</option>
                <option value="FF0400">[Red]</option>
                <option value="EFE800">[Yellow]</option>
                <option value="05EF00">[Green]</option>
                <option value="0206FF">[Blue]</option>
                <option value="FFFFFF" selected>[White]</option>
            </select>
        </form>
    </body>
</html>

此外,您实际上可以使用这些颜色的词...尝试以下 JS:

document.body.style.color = "red";
document.body.style.color = "blue";
document.body.style.color = "grey";
于 2013-03-21T18:57:38.427 回答