热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

如何在纯JavaScript中取消复选框?-HowtouncheckacheckboxinpureJavaScript?

HereistheHTMLCode:这里是HTML代码:<div><inputvaluetruetypecheckbox

Here is the HTML Code:

这里是HTML代码:

I want to change the value to false. Or just uncheck the checkbox. I'd like to do this in pure Javascript, without the use of external libraries (no jQuery etc)

我想把这个值改为false。或者取消复选框。我想用纯Javascript,不使用外部库(没有jQuery等)

4 个解决方案

#1


57  


    
        
    
    

I have added the language attribute to the script element, but it is unnecessary because all browsers use this as a default, but it leaves no doubt what this example is showing.

我已经将语言属性添加到脚本元素中,但这是不必要的,因为所有浏览器都将其作为默认属性,但这无疑说明了这个示例所显示的内容。

If you want to use Javascript to access elements, it has a very limited set of GetElement* functions. So you are going to need to get into the habit of giving every element a UNIQUE id attribute.

如果您想使用Javascript访问元素,它有一组非常有限的GetElement*函数。所以你需要养成给每个元素一个唯一id属性的习惯。

#2


7  

Recommended, without jQuery:

推荐,没有jQuery:

Give your an ID and refer to that. Also, remove the checked="" part of the tag if you want the checkbox to start out unticked. Then it's:

给你的一个ID并引用它。此外,如果希望复选框开始时不勾选,则删除标记的勾选=""部分。然后是:

document.getElementById("my-checkbox").checked = true;

Pure Javascript, with no Element ID (#1):

纯Javascript,无元素ID (#1):

var inputs = document.getElementsByTagName('input');

for(var i = 0; i

Pure Javascript, with no Element ID (#2):

纯Javascript,无元素ID (#2):

document.querySelectorAll('.text input[name="copyNewAddrToBilling"]')[0].checked = true;

document.querySelector('.text input[name="copyNewAddrToBilling"]').checked = true;

Note that the querySelectorAll and querySelector methods are supported in these browsers: IE8+, Chrome 4+, Safari 3.1+, Firefox 3.5+ and all mobile browsers.

注意,这些浏览器支持querySelectorAll和querySelector方法:IE8+、Chrome 4+、Safari 3.1+、Firefox 3.5+和所有移动浏览器。

If the element may be missing, you should test for its existence, e.g.:

如果元素可能丢失,您应该测试它的存在,例如:

var input = document.querySelector('.text input[name="copyNewAddrToBilling"]');
if (!input) { return; }

With jQuery:

jQuery:

$('.text input[name="copyNewAddrToBilling"]').prop('checked', true);

#3


5  

There is another way to do this:

还有另外一种方法:

//elem - get the checkbox element and then
elem.setAttribute('checked', 'checked'); //check
elem.removeAttribute('checked'); //uncheck

#4


0  

You will need to assign an ID to the checkbox:

您需要为复选框分配一个ID:


and then in Javascript:

然后在Javascript中:

document.getElementById("checkboxId").checked = false;

推荐阅读
  • 本文介绍了在满足特定条件时如何在输入字段中使用默认值的方法和相应的代码。当输入字段填充100或更多的金额时,使用50作为默认值;当输入字段填充有-20或更多(负数)时,使用-10作为默认值。文章还提供了相关的JavaScript和Jquery代码,用于动态地根据条件使用默认值。 ... [详细]
  • Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]
  • IjustinheritedsomewebpageswhichusesMooTools.IneverusedMooTools.NowIneedtoaddsomef ... [详细]
  • 表单提交前的最后验证:通常在表单提交前,我们必须确认用户是否都把必须填选的做了,如果没有,就不能被提交到服务器,这里我们用到表单的formname.submit()看演示,其实这个对于我们修炼道 ... [详细]
  • Itwasworkingcorrectly,butyesterdayitstartedgiving401.IhavetriedwithGooglecontactsAPI ... [详细]
  • get()方法用于拦截某个属性的读取操作,如果没有该属性的时候会报一个undefined的,如果结果get处理会返回对应的错误信息varperson{name:张三 ... [详细]
  • 本文介绍了一个Java猜拳小游戏的代码,通过使用Scanner类获取用户输入的拳的数字,并随机生成计算机的拳,然后判断胜负。该游戏可以选择剪刀、石头、布三种拳,通过比较两者的拳来决定胜负。 ... [详细]
  • 如何使用Java获取服务器硬件信息和磁盘负载率
    本文介绍了使用Java编程语言获取服务器硬件信息和磁盘负载率的方法。首先在远程服务器上搭建一个支持服务端语言的HTTP服务,并获取服务器的磁盘信息,并将结果输出。然后在本地使用JS编写一个AJAX脚本,远程请求服务端的程序,得到结果并展示给用户。其中还介绍了如何提取硬盘序列号的方法。 ... [详细]
  • Java容器中的compareto方法排序原理解析
    本文从源码解析Java容器中的compareto方法的排序原理,讲解了在使用数组存储数据时的限制以及存储效率的问题。同时提到了Redis的五大数据结构和list、set等知识点,回忆了作者大学时代的Java学习经历。文章以作者做的思维导图作为目录,展示了整个讲解过程。 ... [详细]
  • 本文讨论了一个关于cuowu类的问题,作者在使用cuowu类时遇到了错误提示和使用AdjustmentListener的问题。文章提供了16个解决方案,并给出了两个可能导致错误的原因。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 开发笔记:实验7的文件读写操作
    本文介绍了使用C++的ofstream和ifstream类进行文件读写操作的方法,包括创建文件、写入文件和读取文件的过程。同时还介绍了如何判断文件是否成功打开和关闭文件的方法。通过本文的学习,读者可以了解如何在C++中进行文件读写操作。 ... [详细]
  • 本文讨论了在openwrt-17.01版本中,mt7628设备上初始化启动时eth0的mac地址总是随机生成的问题。每次随机生成的eth0的mac地址都会写到/sys/class/net/eth0/address目录下,而openwrt-17.01原版的SDK会根据随机生成的eth0的mac地址再生成eth0.1、eth0.2等,生成后的mac地址会保存在/etc/config/network下。 ... [详细]
  • 先看官方文档TheJavaTutorialshavebeenwrittenforJDK8.Examplesandpracticesdescribedinthispagedontta ... [详细]
author-avatar
yangxin
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有