js验证非空后，输入框边框变红，如果输入正确怎么让边框恢复到默认的颜色？

发布网友发布时间：2022-05-25 12:20

共3个回答

热心网友时间：2023-10-27 06:22

默认的边框样式应该是无法恢复的，不同浏览器的边框也不一样。

不过你可以在文本框外面加一个span，只改变span的边框（需要调整一下padding），这样就可以恢复了：

<html>
<head>
    <script type="text/javascript">
        var t = 0;
        function showBorder() {
            var answer3 = document.getElementById("yearId").value;
            if (t == 0) {
                t = 1;
                document.getElementById("yearId").parentElement.style.border = "0";
            }
            else {
                t = 0;
                document.getElementById("yearId").parentElement.style.border = "1px solid black";
            }
        }
    </script>
</head>
<body>
        <span style="padding-bottom: 2px; padding-top: 1px; padding-left: 0; padding-right: 0">
            <input type="text" id="yearId" name="yearId" size="16" /></span>
        <input type="button" value="show border" onclick="showBorder()" />
</body>
</html>

效果图：

热心网友时间：2023-10-27 06:23

你不应该直接修改样式，应该把样式写在css中，然后修改元素的class即可应用和取消样式

热心网友时间：2023-10-27 06:23

a.style.border="";