chiangfai
chiangfai

获取checkbox复选框的值

<title>CheckBox</title>
  <script type = "text/javascript">
	doGetVal: function  doGetVal()
	{
		//var fruitName = document.getElementById("apple").value;//根据ID获取值
		//alert(fruitName);
		//
		var fruit = document.getElementsByName("fruit"); //根据Name拿到集合数组
		for (var i=0;i<fruit.length;i++ )
		{
			if (fruit[i].checked)//checkbox是否选中
			{
				var fruitName = fruit[i].value;
				alert(fruitName);
			}
		}
	}
  </script>
 </head>
 <body>
	<div align="left">
		<input type = "checkBox" id="apple" name="fruit" value="apple"/>apple<br>
		<input type = "checkBox" name="fruit" value="watermelon"/>watermelon<br>
		<input type = "checkBox" name="fruit" value="strawberry"/>strawberry<br>
		<input type = "button" onclick="doGetVal()" value = "click"/>
	</div>
 </body>
</html>

 

你可能感兴趣的:(checkbox)

  • el-table的树形结构结合多选框使用，实现单选父子联动，全选，反选功能 乘嘘圆宝宝 组件封装前端
    ElementUI组件的树形结构结合多选框使用，目前是没有的，现在遇到了个需求，需要点击全选按钮，选中全部；点击父节点需选中其所有子节点，点击子节点需反选其父节点。对上述需求，我封装了一个较为完整的组件来实现：效果：实现思路1.表格增加一列选择项，并使用el-checkbox来勾选，自定义标题（也添上复选框，用来做全选，取消全选功能）2.需要后端配合返回每列数据含有每列数据的勾选状态的字段，如有需
  • C#从入门到精通（3） 画个逗号给明天" C#学习c#开发语言笔记
    目录第九章窗体（1）From窗体（2）MDI窗体（3）继承窗体第十章控件（1）控件常用操作（2）Label控件（3）Button控件（4）TextBox控件（5）RichTextBox控件（6）ComboBox控件（7）CheckBox控件（8）RadioButton控件（9）NumericUpDowm控件（10）ListBox控件（11）Panel控件（12）GroupBox控件（13）TabC
  • 【QT】关于qcheckbox常用的三个信号，{sstateChanged(int) clicked() clicked(bool)}达成巧用 我不是程序猿儿 QT之路qt开发语言
    在Qt中，QCheckBox是一个提供复选框功能的小部件，允许用户选择和取消选择一个或多个选项。QCheckBox提供了几种信号来响应用户的交互，其中stateChanged(int),clicked(),和clicked(bool)是常用的。下面解释这些信号的意义及其用法。1.stateChanged(intstate)这个信号在复选框的状态改变时发出。状态改变可以是用户交互（如点击复选框改变选
  • Android开发随手一个CheckBox 893151960 Android开发案例分享androidAndroid开发Android教程CheckBoxCheckBox选中图片
    Android开发随手一个CheckBoxCheckBox有时忘记怎么写，做下记录当api查也好直接上代码：background就是设置选中和不选中的图片其中：alivc_checkbox_selector.xml觉得不错的，点赞关注下。
  • QT学习笔记(常用控件) 四代目 水门 QT学习笔记qt学习笔记
    QT学习笔记一、QTGUI类继承体系QObject（基类）└──QWidget（所有可视化控件基类）├──QAbstractButton（按钮类基类）│├──QPushButton│├──QRadioButton│└──QCheckBox├──QFrame（带边框控件基类）│└──QLabel├──QLayout（布局管理器基类）└──其他控件类...核心类说明：QObject：所有QT对象的基类
  • vue el-table设置某些行不能选择以及特殊样式 ＊且听风吟 #Vue2.x
    如下图所示，满足特定条件的行不可选择，且颜色被设置成了其他颜色：1）设置行不能选择selectable为element-ui提供的属性，类型为Function，Function的返回值用来决定这一行的CheckBox是否可以勾选，返回true为可选，false为不可选设置方法：js方法，根据每一行的id是否等于某个特定的值判断该行是否可以被选中：checkSelectable<
  • layui 复选框赋值 前端layui
    functioninitCheckBox(name){//从数据库中取出来的以逗号分隔的复选框的值varids="1,2,3";varworkdaysArr=ids.split(",");for(varj=0;j
  • 不要再让 import“占领满屏“啦？ 常威和来福回忆 react.js前端前端框架
    javascript代码解读复制代码//不使用重导importModalfrom'@arco-design/web-react/es/Modal'importCheckboxfrom'@arco-design/web-react/es/Checkbox'importMessagefrom'@arco-design/web-react/es/Message'...//使用模块重导import{Mod
  • 《Ionic Checkbox：深入解析与使用指南》 lsx202406 开发语言
    《IonicCheckbox：深入解析与使用指南》引言在移动应用开发中，用户界面的友好性和易用性至关重要。IonicFramework作为一款流行的开源移动端UI框架，提供了丰富的组件库，其中ionic-checkbox组件是其中之一。本文将深入解析ionic-checkbox的使用方法、特点以及在实际项目中的应用，帮助开发者更好地掌握这一组件。1.ionic-checkbox简介ionic-ch
  • 使用 vxe-table 实现复选框分页跨页勾选 vue.js
    vxe-table实现复选框分页跨页勾选官网：https://vxetable.cn当使用数据分页与复选框多页勾选时，可以通过checkbox-config.reserve启用获取已选import{ref,reactive}from'vue'import{VxeUI}from'vxe-table'constgridRef=ref()constallList=[{id:10001,name:'Tes
  • el-table 手动选择展示列 前端小趴菜05 vue.jsjavascriptelementui
    需求：由于表格的列过多,用滚动条进行滚动对比数据不方便，所以提出，手动选择展示列实现思路：表格默认展示所有字段，每个字段通过v-if属性来进行判断是否显示；点击设置按钮图标(表格右上角），弹出选择框el-popover；选择框中包括：全选复选框、所有字段复选框组el-checkbox-group、取消按钮、确定按钮；选择展示字段后，点击“确定”按钮：更新每个字段值的show属性（true/fals
  • DeepSeek 助力 Vue 开发：打造丝滑的 复选框（Checkbox） 宝码香车 #DeepSeekvue.jsjavascriptecmascript前端DeepSeek前端框架
    前言：哈喽，大家好，今天给大家分享一篇文章！并提供具体代码帮助大家深入理解，彻底掌握！创作不易，如果能帮助到大家或者给大家一些灵感和启发，欢迎收藏+关注哦目录DeepSeek助力Vue开发：打造丝滑的复选框（Checkbox）前言页面效果指令输入属性定义基础属性样式相关属性状态相关属性事件定义其他组件设计文档和示例think组件代码代码测试测试代码正常跑通，附其他基本代码编写路由src\route
  • android中的CheckBox改变背景图片显示大小 辄也 android
    在androidStudio的xml文件设置布局时，对于checkBox选中后，展示大小不同的背景图片1.首先需要一个选择器存放背景图片，设置选中和未选中状态2.在布局文件中设置对应的checkBox,如果对应选中的图片大小不一样的时候，使用一下布局方式可以展示出对应的大小；主要实现时布局中的android:background="@null"android:button="@drawable/s
  • Winform工具箱、属性、事件 今天开心嘛_ Winformc#winform
    工具箱Button------按钮：用户可以点击的按钮控件。CheckBox------复选框：允许用户选择或取消选择选项的复选框。CheckedListBox：结合了ListBox和CheckBox的功能，允许多项选择。ColorDialog------颜色选择对话框：用户可以从中选择颜色。ComboBox-----下拉列表：下拉列表，用户可以从中选择一个选项。ContextMenuStrip：
  • C++MFC常用控件 刘欢(C#) C++c++mfc
    _按钮(Button)_编辑框(EditControl)_标签(StaticText)_超级列表框(ListControl)_分组框(GroupBox)_复选框(CheckBox)_树形框(TreeControl)_图片框(PictureControl)_文件选择框(MFCEditBrowseControl)_选择夹(TabControl)_组合框(ComboBox)_avi短动画命令按钮(Com
  • css设置checkbox和文字在同一水平线上 码农张3 Html+Css
    默认是不在同一水平线上需要在input上添加样式:vertical-align:middle;文字
  • vue2 - elementUI表格table树形结构复选框勾选父子联动示例，el-table树状表格tree复选框checkbox多选框全选/反选取消children（当子级全选中，父级自动勾选） 街尾杂货店& 前端组件与功能(开箱即用)elementuivueel-tableTable表格组件多选功能table树型表格tree复选树状表格check父子勾选联动tree表格每行加入复选框全选
    效果图在vue2+element-ui项目中，实现el-table树形表格每行加入Checkbox多选框（树形表格+多选），Tree树状表格实现复选框多选效果，选中父节点同时勾选其所有子节点（点击某一行也可以进行勾选），在header头部有一个全选/反选按钮，点击后选中全部表格列表或取消全部选择，并且表格行row与复选框全选之间相互联动，支持动态接口数据传入或懒加载数据、表格分页等！提供详细示例代
  • input的Checkbox（复选框）属性具体怎么使用 神明木佑 前端javascript开发语言
    Checkbox（复选框）是一种常用的表单元素，允许用户从一组选项中选择一个或多个选项。它在各种应用程序和网站中广泛使用，为用户提供灵活的选择方式。以下是Checkbox的一些基本用法和注意事项：基本用法：在HTML中，Checkbox是通过标签创建的。每个Checkbox都有一个name属性，用于标识该Checkbox所属的组。当用户提交表单时，只有被选中的Checkbox的值会被发送。Chec
  • android开发--简易登录注册界面及逻辑设计 不会飞的fish。。 笔记
    登录注册界面与逻辑设计1.第一步新建文件（相信各位码农一定会这一步）略。。。2.第二步登录注册界面设计登录界面主要包括几大控件，如登录、注册按钮，账号（Button）、密码输入框（Editext)、复选框等。可以利用shape参数对控件进行美化。界面设计可以线性布局嵌套使用，这样可以很好的对控件调整，美化界面。注册界面主要包括EdiText、Radiobutton、button、checkbox等
  • antd+React.js实现登陆页面，登陆注册页面 变向加后撤 react.js前端前端框架
    今天制作登陆界面，本来想找开原的代码复制粘贴，但奈何网友们是在太过吝啬。找了半天，不如我来做这个开源。代码如下（登陆界面层级都比较分明，故不再做过多解释）importstylesfrom'./login.module.scss';import{Button,Checkbox,Form,Input,Tabs}from'antd';import{UserOutlined,MedicineBoxOutl
  • web前端面试问什么，【前端，2024华为前端高级面试题及答案 uiuuyy67 2024年程序员学习前端面试华为
    效果截图：用户名是只读的，所以无法在text文本框里输入值；账号是禁用的，直接变成灰色了。2.input标签常用的type属性值讲解text文本框password密码框radio单选框checkbox复选框file文件选择hidden隐藏域hidden是用户看不见的东西，给管理员（写网页的）操作保存信息的！submit提交reset重置（2）select下拉框option：下拉选项（下拉框的基本标
  • HTML基础表单练习----用户登录界面 Java搬码工 web前端html5
    表单练习学生信息管理系统mis姓名：年龄：性别：（单选框）男女爱好：（多选）乒乓球爬山唱歌学历：（下拉框）幼儿园小学初中高中大专本科研究生博士教授取消登录界面div{color:blue;}P{color:darkslategrey;}legend{color:yellowgreen;}input{color:sienna;}input:not(.radio.checkbox){padding:4
  • element-plus Cascader 第一级隐藏checkbox或者radio
    1.通过css隐藏//添加样式名称//添加全局样式单选、多选影藏.myCascader.el-cascader-panel.el-cascader-menu:first-child.el-scrollbar__wrapullilabel,.myCascader.el-cascader-panel.el-cascader-menu:first-child.el-scrollbar__wrapulli
  • 如何使用最简单纯Css代码美化checkbox复选框、radios单选框和滑动按钮
    最简洁的代码美化复选框、单选框和滑动按钮效果预览1.复选框.switch{margin:20px20px00;display:flex;align-items:center;width:auto;}.checkbox-input{display:none}.checkbox{-webkit-transition:background-color0.3s;transition:background-
  • HTML中input输入框（详解输入框的用法） 码农白衣 前端知识htmlcss前端htmlcss
    目录一、input介绍1.概念2.好处3.用法4.应用二、input语法1.文本输入框(type="text")2.密码输入框(type="password")3.数字输入框(type="number")4.电子邮件输入框(type="email")5.复选框(type="checkbox")6.单选按钮(type="radio")7.文件上传(type="file")8.隐藏字段(type="h
  • vue项目中所使用的element-UI / echarts Stephy_Yy #调研#vue学习笔记
    高清版思维导图见后台管理项目地址1.login登录页面表单在Form组件中，每一个表单域由一个Form-Item组件构成，表单域中可以放置各种类型的表单控件，包括Input、Select、Checkbox、Radio、Switch、DatePicker、TimePickerForm组件提供了表单验证的功能，只需要通过rules属性传入约定的验证规则，并将Form-Item的prop属性设置为需校验
  • Element-ui el-tree 父节点不显示复选框 子节点显示复选框 鱼一直下m Js前端
    需求：父节点不显示复选框子节点显示复选框一.父节点不显示复选框子节点显示复选框(如图)二.改后效果(如图)三.上代码(如图)添加css样式.el-tree.el-tree-node.is-leaf+.el-checkbox.el-che
  • 全网最最实用--教你用gradio搭网页、部署模型等（代码粘贴即用、不讲虚的） 绒绒毛毛雨 大模型算法microsoft前端语言模型人工智能ai
    文章目录〇前言一、构建网页1.各个组件介绍a.文本输入和输出b.图像输入和输出c.音频输入和输出d.视频输入和输出e.文件上传和下载f.滑块(`Slider`)g.单选按钮(`Radio`)h.复选框(`CheckboxGroup`)j.数据表格(`Dataframe`)2.一个网页示例代码a.按钮使用指南（事件处理和回调）3.整个网页代码b.整个网页展示二、构建ai任务a.构建一个自己的大语言模
  • vxe-table设置表格selectedRowKeys变更时，刷新列表勾选状态 柠檬花开_ vxetableselectedRowKeys动态表格
    this.$refs.vuexTable.$refs.vxeTableInstance.clearCheckboxRow()
  • tkinter中text属性_tkinter属性（总结） 俠之大者 tkinter中text属性
    一、主要控件1.Button按钮。类似标签,但提供额外的功能,例如鼠标掠过、按下、释放以及键盘操作事件2.Canvas画布。提供绘图功能(直线、椭圆、多边形、矩形)可以包含图形或位图3.Checkbutton选择按钮。一组方框,可以选择其中的任意个(类似HTML中的checkbox)4.Entry文本框。单行文字域,用来收集键盘输入(类似HTML中的text)5.Frame框架。包含其他组件的纯容
  • redis学习笔记——不仅仅是存取数据 Everyday都不同 returnSourceexpire/delincr/lpush数据库分区redis
    最近项目中用到比较多redis，感觉之前对它一直局限于get/set数据的层面。其实作为一个强大的NoSql数据库产品，如果好好利用它，会带来很多意想不到的效果。（因为我搞java，所以就从jedis的角度来补充一点东西吧。PS：不一定全，只是个人理解，不喜勿喷）   1、关于JedisPool.returnSource(Jedis jeids)   这个方法是从red
  • SQL性能优化-持续更新中。。。。。。 atongyeye oraclesql
    1 通过ROWID访问表--索引 你可以采用基于ROWID的访问方式情况,提高访问表的效率, , ROWID包含了表中记录的物理位置信息..ORACLE采用索引(INDEX)实现了数据和存放数据的物理位置(ROWID)之间的联系. 通常索引提供了快速访问ROWID的方法,因此那些基于索引列的查询就可以得到性能上的提高. 2 共享SQL语句--相同的sql放入缓存 3 选择最有效率的表
  • [JAVA语言]JAVA虚拟机对底层硬件的操控还不完善 comsci JAVA虚拟机
         如果我们用汇编语言编写一个直接读写CPU寄存器的代码段，然后利用这个代码段去控制被操作系统屏蔽的硬件资源，这对于JVM虚拟机显然是不合法的，对操作系统来讲，这样也是不合法的，但是如果是一个工程项目的确需要这样做，合同已经签了，我们又不能够这样做，怎么办呢？ 那么一个精通汇编语言的那种X客，是否在这个时候就会发生某种至关重要的作用呢？ &n
  • lvs- real 男人50 LVS
    #!/bin/bash # # Script to start LVS DR real server. # description: LVS DR real server # #.  /etc/rc.d/init.d/functions VIP=10.10.6.252 host='/bin/hostname' case "$1" in sta
  • 生成公钥和私钥 oloz DSA安全加密
    package com.msserver.core.util; import java.security.KeyPair; import java.security.PrivateKey; import java.security.PublicKey; import java.security.SecureRandom; public class SecurityUtil {
  • UIView 中加入的cocos2d，背景透明 374016526 cocos2dglClearColor
    要点是首先pixelFormat:kEAGLColorFormatRGBA8，必须有alpha层才能透明。然后view设置为透明glView.opaque = NO;[director setOpenGLView:glView];[self.viewController.view setBackgroundColor:[UIColor clearColor]];[self.viewControll
  • mysql常用命令 香水浓 mysql
    连接数据库 mysql -u troy -ptroy 备份表 mysqldump -u troy -ptroy mm_database mm_user_tbl > user.sql 恢复表（与恢复数据库命令相同） mysql -u troy -ptroy mm_database < user.sql 备份数据库 mysqldump -u troy -ptroy
  • 我的架构经验系列文章 - 后端架构 - 系统层面 agevs JavaScriptjquerycsshtml5
    系统层面： 高可用性 所谓高可用性也就是通过避免单独故障加上快速故障转移实现一旦某台物理服务器出现故障能实现故障快速恢复。一般来说，可以采用两种方式，如果可以做业务可以做负载均衡则通过负载均衡实现集群，然后针对每一台服务器进行监控，一旦发生故障则从集群中移除；如果业务只能有单点入口那么可以通过实现Standby机加上虚拟IP机制，实现Active机在出现故障之后虚拟IP转移到Standby的快速
  • 利用ant进行远程tomcat部署 aijuans tomcat
    在javaEE项目中，需要将工程部署到远程服务器上，如果部署的频率比较高，手动部署的方式就比较麻烦，可以利用Ant工具实现快捷的部署。这篇博文详细介绍了ant配置的步骤（http://www.cnblogs.com/GloriousOnion/archive/2012/12/18/2822817.html），但是在tomcat7以上不适用，需要修改配置，具体如下： 1.配置tomcat的用户角色
  • 获取复利总收入 baalwolf 获取
           public static void main(String args[]){         int money=200;         int year=1;         double rate=0.1; &
  • eclipse.ini解释 BigBird2012 eclipse
    大多数java开发者使用的都是eclipse，今天感兴趣去eclipse官网搜了一下eclipse.ini的配置，供大家参考，我会把关键的部分给大家用中文解释一下。还是推荐有问题不会直接搜谷歌，看官方文档，这样我们会知道问题的真面目是什么，对问题也有一个全面清晰的认识。 Overview 1、Eclipse.ini的作用 Eclipse startup is controlled by th
  • AngularJS实现分页功能 bijian1013 JavaScriptAngularJS分页
            对于大多数web应用来说显示项目列表是一种很常见的任务。通常情况下，我们的数据会比较多，无法很好地显示在单个页面中。在这种情况下，我们需要把数据以页的方式来展示，同时带有转到上一页和下一页的功能。既然在整个应用中这是一种很常见的需求，那么把这一功能抽象成一个通用的、可复用的分页（Paginator）服务是很有意义的。   &nbs
  • [Maven学习笔记三]Maven archetype bit1129 ArcheType
    archetype的英文意思是原型，Maven archetype表示创建Maven模块的模版，比如创建web项目，创建Spring项目等等.   mvn archetype提供了一种命令行交互式创建Maven项目或者模块的方式，   mvn archetype   1.在LearnMaven-ch03目录下，执行命令mvn archetype:gener
  • 【Java命令三】jps bit1129 Java命令
    jps很简单，用于显示当前运行的Java进程，也可以连接到远程服务器去查看   [hadoop@hadoop bin]$ jps -help usage: jps [-help] jps [-q] [-mlvV] [<hostid>] Definitions: <hostid>: <hostname>[:
  • ZABBIX2.2 2.4 等各版本之间的兼容性 ronin47
    zabbix更新很快，从2009年到现在已经更新多个版本，为了使用更多zabbix的新特性，随之而来的便是升级版本，zabbix版本兼容性是必须优先考虑的一点 客户端AGENT兼容 zabbix1.x到zabbix2.x的所有agent都兼容zabbix server2.4：如果你升级zabbix server，客户端是可以不做任何改变，除非你想使用agent的一些新特性。 Zabbix代理（p
  • unity 3d还是cocos2dx哪个适合游戏？ brotherlamp unity自学unity教程unity视频unity资料unity
    unity 3d还是cocos2dx哪个适合游戏？ 问：unity 3d还是cocos2dx哪个适合游戏？ 答：首先目前来看unity视频教程因为是3d引擎，目前对2d支持并不完善，unity 3d 目前做2d普遍两种思路，一种是正交相机，3d画面2d视角，另一种是通过一些插件，动态创建mesh来绘制图形单元目前用的较多的是2d toolkit，ex2d，smooth moves，sm2，
  • 百度笔试题：一个已经排序好的很大的数组，现在给它划分成m段，每段长度不定，段长最长为k，然后段内打乱顺序，请设计一个算法对其进行重新排序 bylijinnan java算法面试百度招聘
    import java.util.Arrays; /** * 最早是在陈利人老师的微博看到这道题： * #面试题#An array with n elements which is K most sorted，就是每个element的初始位置和它最终的排序后的位置的距离不超过常数K * 设计一个排序算法。It should be faster than O(n*lgn)。
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他