Question

我有一个文本框，用户可以输入一个颜色的十六进制值。文本框将颜色更改为输入的十六进制值，但是问题是，如果输入是黑色阴影或任何深色，则很难或不可能看到已输入的十六进制值。因此，我希望输入的文本具有不同的颜色轮廓，例如白色，以便用户可以清楚地看到他们输入的内容。

这是我的代码的一部分：

<head>
    <style>
        #ColourInput { /* apply this style to element id="ColourInput" */
            left: 240px;
            top: 60px;
            width: 100px;
        }


        input[type=text]:focus {
          border: 3px solid #555;
    </style>
<script>
        function fnCustomColour() {
            var sHexValue = document.getElementById("ColourInput").value;
            var ValueValid = 0
            fnDebugMessage(sHexValue);

            if (/[0-9A-F]{6}$/i.test(sHexValue)) {

                if (sHexValue.indexOf("#") === 0) {

                } else {
                    sHexValue = "#"+sHexValue 
                }
                ValueValid = 1

            } else {
                alert("Value not allowed");
                ValueValid = 0
            }

            if (ValueValid = 1) {   
                ColourInput.style.backgroundColor = sHexValue;
                fnSetFillColour(sHexValue);
                fnDebugMessage(sHexValue);
            }

        }

    </script>
</head>

            <div id="CustomColour">
            Custom Colour Input: #<input type="text" id="ColourInput" name="CustomColour" placeholder="Enter Hex Value" pattern="[a-fA-F0-9]{8}$/i"><br>
            <input type="submit" onclick="fnCustomColour();" id="ColourSubmit" value="Submit">
            </div>

任何帮助将不胜感激

为文本输入创建文本轮廓

0 个答案: