表单验证上的彩色单选按钮-Javascript

Colour radio buttons on form validation - Javascript

本文关键字：单选按钮 -Javascript 彩色 验证 表单      更新时间：2024-01-02

目前我有这个：

function validateRadio(x){
if(document.getElementById(x).checked){
return true;
}else{
return false;
}
}

这是HTML:

<strong> Smoking Area? </strong>
<br>
Yes <input type="radio" name="hand" id="left" value="Left" onblur="validateRadio(id)"/>
No <input type="radio" name="hand" id="right" value="Right" onblur="validateRadio(id)"/>
<span class="validateError" id="handError" style="display: none;">Please specify whether you would like a table in the smoking area.</span>
<br><br>

但是，如果没有单击单选按钮，我希望它显示为红色，如果单击一次并通过验证，则显示为绿色，这可能吗？

此外，我希望在单击单选按钮后隐藏警告，目前它仍在页面上。如有任何帮助，我们将不胜感激：）

不太清楚你到底想画什么，但如果你谈论的是单选按钮本身，我认为设计自己的按钮（具有打开和关闭状态的图像）并使用它们会更好。这样，您就可以保持跨浏览器的一致性，并为您的网站提供更好的/自定义的外观。

然而，你谈论的是文本部分（"吸烟区"、"是/否"），最简单的方法是给他们的容器一个id，然后做一些类似的事情：

function validateRadio(x){
    if(document.getElementById(x).checked){
        document.getElementById('your_container').style.color = 'green';
        return true;
    }else{
        document.getElementById('your_container').style.color = 'red';
        return false;
    }
}
相关文章：