如何在Javascript中通过输入更改字体颜色

时间:2015-12-31 10:38:42

标签: javascript html

我必须通过在Javascript中获取用户输入来更改字体颜色。这是HTML代码:

  <!DOCTYPE html>
    <html>
    <head>
        <meta name="keywords" content="JavaScript, UserInput" />
        <title>JavaScript accept user input demo</title>
        <script type="text/javascript">
            function displayOutput() {
                var input = document.getElementById("userInput").value;
                if (input.length === 0) {
                    alert("Please enter a valid input");
                    return;
                }
               document.getElementById("result").innerHTML = input;
            }
        </script>
    </head>
    <body>
        <h1 id="result">Example</h1>
        <input type="text" id="userInput"  />
        <select name="color" type="text" >
        <option value="select">Select</option>
        <option value="blue">Blue</option>
        <option value="green">Green</option>
        <option value="white">White</option>
        <option value="black">Black</option>
        </select>
<input type="submit" value="Submit" onclick="displayOutput()" />
</body>    
</html>

请帮我改变结果字体颜色。?

1 个答案:

答案 0 :(得分:1)

您可以直接使用style.color。使用以下代码。

document.getElementById("userInput").style.color=document.getElementById('color').value

参考jsfiddle样本。

https://jsfiddle.net/fNPvf/22891/