js实现全选checkbox

js代码

function selectAllCheckBox(parentid) {
            var PID = document.getElementById(parentid);
            var cb = PID.getElementsByTagName("input");
            for(var i=0;i<cb.length;i++){
                if(cb[i].type == "checkbox"){
                    cb[i].checked = "checked";
                }
            }
        }

表单

<div id = "awardall-frame-down">
  <button id = "selectallbtn" class="selectallbtn" onclick="selectAllCheckBox(‘awardall-frame-down‘)">全选</button>
  <input type="checkbox" name="area_id" value="Car">一区</input>
  <input type="checkbox" name="area_id" value="Car">二区</input>
  <input type="checkbox" name="area_id" value="Car">三区</input>
  <input type="checkbox" name="area_id" value="Car">四区</input>
  <input type="checkbox" name="area_id" value="Car">五区</input>
  <input type="checkbox" name="area_id" value="Car">六区</input>
  <input type="checkbox" name="area_id" value="Car">七区</input>
  <input type="checkbox" name="area_id" value="Car">八区</input>
</div>
时间: 2024-10-10 22:30:03

js实现全选checkbox的相关文章

js实现全选功能

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

第十六篇 JS实现全选操作

JS实现全选 嗨,同学们好,老师这里是专门教同学解决一些针对性的问题,所以说综合起来,就要靠同学自己了. 这节课我们学一个很实用的东西,全选操作!比如淘宝这种商城对吧,我的购物车,我要全选购买,或者删除,一个一个的来肯定麻烦,所以就有了全选和批量处理,那就是复选框! 这里我们用一个table表格来控制吧!看代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&

js购物车全选反选、商品价格统计

模仿淘宝购物车的全选全不选,根据选中的商品计算价格,指定店铺选择.以下是我自己在做H5页面的时候整理出来的,想我一个纯php的来写成这样也不容易.不完善的地方欢迎各位小伙伴指出~ html代码: <body>     <header class="mui-bar mui-bar-nav">         <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"

用js做出全选和反选效果

效果图如下: <script language="javascript" type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" language="javascript"> $(function(){  $("#selecAll").clic

js实现全选与全部取消功能

function checkAll() { //把所有参与选择的checkbox使用相同的name,这里为"num_iid"    var eles = document.getElementsByName("num_iid");    var i = 0; // 如果是全选状态,则取消所有的选择    if (isSelectAll() == true) {  for ( i = 0; i < eles.length; i++) {   eles[i].ch

elementUI+JS实现全选与反选

在实际项目开发过程中,遇到的需求,需要实现全选以及取消全选等功能,主要使用ElementUI + JS来实现,具体代码如下: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initia

js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false

用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种方式使<input type="checkbox" />中的复选框被选中. 方法一:直接在HTML行间中添加checked属性.   eg:<input type="checkbox" checked /> 方法二:使用javascript使in

php处理表单中的复选框问题以及js实现全选

做的一个项目中遇到了全选和取消全选的问题,这是一个很普遍的功能,,虽然我们经常用到,但是真正做起来却发现行不通,在网上找了些,大部分都是ie,但是谷歌内核浏览器不能正常实现,所以经过小小的调整,今天就把调试好的代码发上来供大家参考使用. 首先要记得引用jquery框架,这样写起代码来相对容易点,尤其突出在选择器上. 1 <html> 2 <head> 3 <script src="./libs/js/jquery.min.js"></scrip

一个js编写全选、弹出对话框、ajax-json的案例

js功能有:全选.弹出对话框.使用json传输ajax数据:不想在写多余的文字了,直接上代码: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib prefix="c" uri="http://java.sun.com/jstl/core"%>