在HTML5中，取消默认选中可以通过设置checked属性为false或者使用JavaScript来实现，下面将详细介绍这两种方法。
checked
false
让客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户，将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴，公司提供的服务项目有：主机域名、虚拟空间、营销软件、网站建设、郎溪网站维护、网站推广。
方法一：使用checked属性
在HTML5中，表单元素（如、</code>、<code><select></code>等）的默认选中状态是通过<code>checked</code>属性来控制的，当<code>checked</code>属性设置为<code>true</code>时，元素会被默认选中；当设置为<code>false</code>时，元素则不会被默认选中。</p><p>我们有一个单选按钮：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="radio" name="gender" id="male" checked> <label for="male">男</label><br> <input type="radio" name="gender" id="female"> <label for="female">女</label><br> <input type="radio" name="gender" id="other"> <label for="other">其他</label><br> </form> </body> </html> </pre><p>在这个例子中，所有单选按钮都被默认选中，要取消默认选中，只需将对应的<code>checked</code>属性设置为<code>false</code>：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="radio" name="gender" id="male" checked> <label for="male">男</label><br> <input type="radio" name="gender" id="female"> <label for="female">女</label><br> <input type="radio" name="gender" id="other"> <label for="other">其他</label><br> </form> <script> document.getElementById("male").checked = false; // 取消男选项的默认选中 document.getElementById("female").checked = false; // 取消女选项的默认选中 document.getElementById("other").checked = false; // 取消其他选项的默认选中 </script> </body> </html> </pre><p>方法二：使用JavaScript</p><p>除了使用<code>checked</code>属性外，我们还可以使用JavaScript来动态地取消元素的默认选中状态，这通常在页面加载完成后执行，以确保元素已经存在于DOM中。</p><p>我们有一个复选框：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="checkbox" name="hobbies" id="reading" checked> <label for="reading">阅读</label><br> <input type="checkbox" name="hobbies" id="sports"> <label for="sports">运动</label><br> <input type="checkbox" name="hobbies" id="music"> <label for="music">音乐</label><br> </form> <script> window.onload = function() { // 确保页面加载完成后执行以下代码 document.getElementById("reading").checked = false; // 取消阅读选项的默认选中状态 document.getElementById("sports").checked = false; // 取消运动选项的默认选中状态 document.getElementById("music").checked = false; // 取消音乐选项的默认选中状态 } </script> </body> </html> </pre><p>归纳一下，取消HTML5元素的默认选中状态有两种方法：一是直接设置<code>checked</code>属性为<code>false</code>；二是使用JavaScript在页面加载完成后动态地取消元素的默认选中状态，根据实际需求和场景，可以选择合适的方法来实现这一功能。</p> <br> 名称栏目：html5如何取消默认选中 <br> 分享地址：<a href="http://www.jxjierui.cn/article/djopidc.html">http://www.jxjierui.cn/article/djopidc.html</a> </div> <div class="hot_new"> <div class="page_title clearfix"> <h3>其他资讯</h3> </div> <div class="news_list clearfix"> <ul> <li> <a href="/article/dhogjgg.html">win7计算机里的图库不见了？（找回windows7照片查看）</a> </li><li> <a href="/article/dhogjhe.html">轻量服务器外网访问不了的缘由分析</a> </li><li> <a href="/article/dhogjhi.html">只有域名不用服务器可以备案吗？（美国免备案虚拟主机怎么购买）</a> </li><li> <a href="/article/dhogjgp.html">容器中的JVM资源该如何被安全的限制？</a> </li><li> <a href="/article/dhogjpg.html">如何使用C语言数组取出数据库中的中间数据？(c语言数组取中间的数据库)</a> </li> </ul> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <!-- 底部信息 --> <div class="footer wow fadeInUp"> <div class="rowFluid"> <div class="span12"> <div class="container"> <div class="footer_content"> <div class="span4 col-xm-12"> <div class="footer_list"> <div class="span6"> <div class="bottom_logo"><img src="/Public/Home/images/ewm.jpg" alt="微信服务号二维码" /></div> </div> <div class="span6 col-xm-12"> <div class="quick_navigation"> <div class="quick_navigation_title">快速导航</div> <ul> <li><a href="http://www.ifslb.com/" title="成都柴油发电机公司" target="_blank">成都柴油发电机公司</a></li><li><a href="https://www.cdxwcx.com/" title="成都网站制作" target="_blank">成都网站制作</a></li><li><a href="http://www.cdxwcx.cn/tuoguan/meishan.html" title="眉山电信机房托管" target="_blank">眉山电信机房托管</a></li><li><a href="http://www.cdwuji.com/" title="正泰动物" target="_blank">正泰动物</a></li><li><a href="http://www.cdhuace.com/zhaopai.html" title="发光字制作" target="_blank">发光字制作</a></li><li><a href="http://chengdu.cdxwcx.cn/" title="成都网站制作" target="_blank">成都网站制作</a></li><li><a href="https://www.cdcxhl.com/cloud/" title="云服务器" target="_blank">云服务器</a></li> </ul> </div> </div> </div> </div> <div class="span4 col-xm-6 col-xs-12"> <div class="footer_list"> <div class="footer_link"> <div class="footer_link_title">友情链接</div> <ul id="frientLinks"> <a href="https://www.cdcxhl.com/" title="网站制作" target="_blank">网站制作</a> <a href="https://www.cdcxhl.com/" title="网站建设" target="_blank">网站建设</a> <a href="https://www.cdxwcx.com/tuiguang/" title="成都网络推广" target="_blank">网络推广</a> <a href="http://seo.cdkjz.cn/" title="成都网站推广" target="_blank">网站推广</a> <a href="https://www.cdcxhl.com/xiaochengx.html" title="成都微信小程序开发" target="_blank">小程序开发</a> <a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a> </ul> <div class="footer_link_title">网站建设</div> <ul id="frientLinks"> <li><a href="/">内江浩晨众云建站</a></li> <li><a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a></li> </ul> </div> </div> </div> <div class="span4 col-xm-6 col-xs-12"> <div class="footer_list"> <div class="footer_cotact"> <div class="footer_cotact_title">联系方式</div> <ul> <li><span class="footer_cotact_type">企业：</span><span class="footer_cotact_content">青羊区浩晨众云设计工作室（个体工商户）</span></li> <li><span class="footer_cotact_type">地址：</span><span class="footer_cotact_content">成都市青羊区太升南路288号</span></li> <li><span class="footer_cotact_type">电话：</span><span class="footer_cotact_content"><a href="tel:18980820575" class="call">18980820575</a></span></li> <li><span class="footer_cotact_type">网址：</span><span class="footer_cotact_content"><a href="/" title="内江网站建设">www.jxjierui.cn</a></span></li> </ul> </div> </div> </div> </div> </div> <div class="copyright"> <p>公司名称：青羊区浩晨众云设计工作室（个体工商户） 联系电话：18980820575</p> <p><a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow">网站备案号：蜀ICP备2025119795号-2</a></p> <p>内江浩晨众云建站 内江网站建设 内江网站设计 内江网站制作 <a href="http://www.cdxwcx.cn/" target="_blank">成都做网站</a></p> </div> </div> </div> </div> </body> </html> <script> $(".technical_support_box_z_info_box img").each(function(){ var src = $(this).attr("src"); //获取图片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //绝对路径 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>
</code>、<code><select></code>等）的默认选中状态是通过<code>checked</code>属性来控制的，当<code>checked</code>属性设置为<code>true</code>时，元素会被默认选中；当设置为<code>false</code>时，元素则不会被默认选中。</p><p>我们有一个单选按钮：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="radio" name="gender" id="male" checked> <label for="male">男</label><br> <input type="radio" name="gender" id="female"> <label for="female">女</label><br> <input type="radio" name="gender" id="other"> <label for="other">其他</label><br> </form> </body> </html> </pre><p>在这个例子中，所有单选按钮都被默认选中，要取消默认选中，只需将对应的<code>checked</code>属性设置为<code>false</code>：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="radio" name="gender" id="male" checked> <label for="male">男</label><br> <input type="radio" name="gender" id="female"> <label for="female">女</label><br> <input type="radio" name="gender" id="other"> <label for="other">其他</label><br> </form> <script> document.getElementById("male").checked = false; // 取消男选项的默认选中 document.getElementById("female").checked = false; // 取消女选项的默认选中 document.getElementById("other").checked = false; // 取消其他选项的默认选中 </script> </body> </html> </pre><p>方法二：使用JavaScript</p><p>除了使用<code>checked</code>属性外，我们还可以使用JavaScript来动态地取消元素的默认选中状态，这通常在页面加载完成后执行，以确保元素已经存在于DOM中。</p><p>我们有一个复选框：</p><pre class="brush:html;toolbar:false"> <!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>取消默认选中示例</title> </head> <body> <form> <input type="checkbox" name="hobbies" id="reading" checked> <label for="reading">阅读</label><br> <input type="checkbox" name="hobbies" id="sports"> <label for="sports">运动</label><br> <input type="checkbox" name="hobbies" id="music"> <label for="music">音乐</label><br> </form> <script> window.onload = function() { // 确保页面加载完成后执行以下代码 document.getElementById("reading").checked = false; // 取消阅读选项的默认选中状态 document.getElementById("sports").checked = false; // 取消运动选项的默认选中状态 document.getElementById("music").checked = false; // 取消音乐选项的默认选中状态 } </script> </body> </html> </pre><p>归纳一下，取消HTML5元素的默认选中状态有两种方法：一是直接设置<code>checked</code>属性为<code>false</code>；二是使用JavaScript在页面加载完成后动态地取消元素的默认选中状态，根据实际需求和场景，可以选择合适的方法来实现这一功能。</p> <br> 名称栏目：html5如何取消默认选中 <br> 分享地址：<a href="http://www.jxjierui.cn/article/djopidc.html">http://www.jxjierui.cn/article/djopidc.html</a> </div> <div class="hot_new"> <div class="page_title clearfix"> <h3>其他资讯</h3> </div> <div class="news_list clearfix"> <ul> <li> <a href="/article/dhogjgg.html">win7计算机里的图库不见了？（找回windows7照片查看）</a> </li><li> <a href="/article/dhogjhe.html">轻量服务器外网访问不了的缘由分析</a> </li><li> <a href="/article/dhogjhi.html">只有域名不用服务器可以备案吗？（美国免备案虚拟主机怎么购买）</a> </li><li> <a href="/article/dhogjgp.html">容器中的JVM资源该如何被安全的限制？</a> </li><li> <a href="/article/dhogjpg.html">如何使用C语言数组取出数据库中的中间数据？(c语言数组取中间的数据库)</a> </li> </ul> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <!-- 底部信息 --> <div class="footer wow fadeInUp"> <div class="rowFluid"> <div class="span12"> <div class="container"> <div class="footer_content"> <div class="span4 col-xm-12"> <div class="footer_list"> <div class="span6"> <div class="bottom_logo"><img src="/Public/Home/images/ewm.jpg" alt="微信服务号二维码" /></div> </div> <div class="span6 col-xm-12"> <div class="quick_navigation"> <div class="quick_navigation_title">快速导航</div> <ul> <li><a href="http://www.ifslb.com/" title="成都柴油发电机公司" target="_blank">成都柴油发电机公司</a></li><li><a href="https://www.cdxwcx.com/" title="成都网站制作" target="_blank">成都网站制作</a></li><li><a href="http://www.cdxwcx.cn/tuoguan/meishan.html" title="眉山电信机房托管" target="_blank">眉山电信机房托管</a></li><li><a href="http://www.cdwuji.com/" title="正泰动物" target="_blank">正泰动物</a></li><li><a href="http://www.cdhuace.com/zhaopai.html" title="发光字制作" target="_blank">发光字制作</a></li><li><a href="http://chengdu.cdxwcx.cn/" title="成都网站制作" target="_blank">成都网站制作</a></li><li><a href="https://www.cdcxhl.com/cloud/" title="云服务器" target="_blank">云服务器</a></li> </ul> </div> </div> </div> </div> <div class="span4 col-xm-6 col-xs-12"> <div class="footer_list"> <div class="footer_link"> <div class="footer_link_title">友情链接</div> <ul id="frientLinks"> <a href="https://www.cdcxhl.com/" title="网站制作" target="_blank">网站制作</a> <a href="https://www.cdcxhl.com/" title="网站建设" target="_blank">网站建设</a> <a href="https://www.cdxwcx.com/tuiguang/" title="成都网络推广" target="_blank">网络推广</a> <a href="http://seo.cdkjz.cn/" title="成都网站推广" target="_blank">网站推广</a> <a href="https://www.cdcxhl.com/xiaochengx.html" title="成都微信小程序开发" target="_blank">小程序开发</a> <a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a> </ul> <div class="footer_link_title">网站建设</div> <ul id="frientLinks"> <li><a href="/">内江浩晨众云建站</a></li> <li><a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a></li> </ul> </div> </div> </div> <div class="span4 col-xm-6 col-xs-12"> <div class="footer_list"> <div class="footer_cotact"> <div class="footer_cotact_title">联系方式</div> <ul> <li><span class="footer_cotact_type">企业：</span><span class="footer_cotact_content">青羊区浩晨众云设计工作室（个体工商户）</span></li> <li><span class="footer_cotact_type">地址：</span><span class="footer_cotact_content">成都市青羊区太升南路288号</span></li> <li><span class="footer_cotact_type">电话：</span><span class="footer_cotact_content"><a href="tel:18980820575" class="call">18980820575</a></span></li> <li><span class="footer_cotact_type">网址：</span><span class="footer_cotact_content"><a href="/" title="内江网站建设">www.jxjierui.cn</a></span></li> </ul> </div> </div> </div> </div> </div> <div class="copyright"> <p>公司名称：青羊区浩晨众云设计工作室（个体工商户） 联系电话：18980820575</p> <p><a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow">网站备案号：蜀ICP备2025119795号-2</a></p> <p>内江浩晨众云建站 内江网站建设 内江网站设计 内江网站制作 <a href="http://www.cdxwcx.cn/" target="_blank">成都做网站</a></p> </div> </div> </div> </div> </body> </html> <script> $(".technical_support_box_z_info_box img").each(function(){ var src = $(this).attr("src"); //获取图片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //绝对路径 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>
建站
咨询
售后
建站咨询