HTML 中 `<input>` 属性中设置 `checked` 不生效的问题

57 篇文章 ¥59.90 ¥99.00
本文探讨了在HTML中,为何设置input的checked属性后单选按钮未选中的问题,包括错误的属性位置、重复的name属性、多个选中、JavaScript操作及CSS样式覆盖等可能原因,并提供了相应的解决方案和代码示例。

在 HTML 中,使用 <input> 元素可以创建多种表单控件,包括单选按钮(radio buttons)。通过设置 checked 属性,可以在页面加载时预先选中某个单选按钮。然而,有时候在设置 checked 属性后,单选按钮却没有预期的选中效果。本文将详细介绍可能导致 checked 属性不生效的原因,并提供相应的源代码示例。

以下是一些可能导致 checked 属性不生效的常见问题和解决方案:

  1. 错误的属性位置:确保 checked 属性位于正确的位置。它应该作为 <input> 元素的属性之一,位于 typename 等属性之后。例如:
<input type="radio"
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册页面</title> <style> .d1{ font-size: 15px; font-weight: bold; font-family: 华文楷体; color: white; } </style> <script> var number=0 function change(){ var a = Math.random() a1 = Math.floor(a*255) var b = Math.random() b1 = Math.floor(b*255) var c = Math.random() c1 = Math.floor(c*255) document.getElementById('c2').style .background = "rgb("+a1+","+b1+","+c1+")" var a = Math.random() a1 = Math.floor(a*255) var b = Math.random() b1 = Math.floor(b*255) var c = Math.random() c1 = Math.floor(c*255) document.getElementById('c3').style .color = "rgb("+a1+","+b1+","+c1+")" number2 = number%3 var id =document.getElementById('c1') if (number2==0){ id.style.backgroundImage = "url('../../pictures/img1.jpg')" id.style.backgroundSize = "100% 100%" } if (number2==1){ id.style.backgroundImage = "url('../../pictures/img2.jpg')" id.style.backgroundSize = "100% 100%" } if (number2==2){ id.style.backgroundImage = "url('../../pictures/img3.jpg')" id.style.backgroundSize = "100% 100%" } number++ } </script> </head> <body id="c2"> <form > <div align="center"><P id="c3">个人博客注册</P></div> <table align="center" id="c1"> <tr> <td class="d1">用户名:</td> <td><input type="text" name="username" placeholder="软工2312-吕阳"></td> </tr> <tr> <td class="d1">密码:</td> <td><input type="password" name="password" placeholder="请输入密码"></td> </tr> <tr> <td class="d1">性别:</td> <td> <input type="radio" name="sex" value="男">男 <input type="radio" name="sex" value="女">女 <input type="radio" name="sex" value="未知" checked>未知 </td> </tr> <tr> <td class="d1">居住地:</td> <td> <select> <option>北京</option> <option selected>山西</option> <option>深圳</option> </select> </td> </tr> <tr> <td><input type="submit" value="立即注册"></td> <td><input type="reset"></td> </tr> </table> </form> <button onclick="change()" >更换主题</button> </body> </html>无法更改文字颜色,并且背景和图片的更改也受到了影响
最新发布
10-09
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值