仵航说如何html中的单选按钮禁用仵老大

最新推荐文章于 2024-12-18 22:15:00 发布

仵航

最新推荐文章于 2024-12-18 22:15:00 发布

阅读量721

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： js

本文链接：https://blog.youkuaiyun.com/whbn8888/article/details/115069159

前端专栏收录该内容

3 篇文章

订阅专栏

这篇博客分享了一个关于前端开发的小技巧。作者在维护一个Spring+Hibernate的老项目时，遇到前端使用原生JavaScript的问题。由于长时间使用Vue，对于原生JS不熟悉，因此在实现查看页面中禁用单选按钮功能时遇到了困扰。通过百度搜索找到了解决方案，通过`disabled`属性禁用ID为`cats`的单选按钮。博客中提供了完整的HTML和JavaScript代码示例，展示了如何在用户点击按钮时禁用特定单选按钮。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近写的项目是老项目,Spring+hibernate的,前端直接js,Vue写多了,原生js不会了,还要去百度,功能大致为,有一个查看页面,表单跟修改一样,但是不能修改,input的框的可以,我直接设置

readonly="readonly"

就可以了,但是,这个单选有点麻烦了,所以我就百度了一下,纪念一下

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>仵老大学习网</title>
</head>
<body>

<form>
猫:<input type="radio" name="pet" id="cats"><br>
狗:<input type="radio" name="pet" id="dogs">
</form>
<p>单击下面的按钮禁用第一个单选框。</p>
<button onclick="disableElement()">禁用单选框按钮</button>
<script>
function disableElement(){
  document.getElementById("cats").disabled=true;
}
</script>
</body>
</html>