checkbox 选中事件（js动态生成的checkbox取值和选中事件）

本文目录

• js动态生成的checkbox取值和选中事件
• checkbox的单击事件没有反应，选中任意复选框，其他两个复选框就取消选中，但是为什么js没有反应
• checkbox 选中事件哪个
• checkbox 选中事件哪个
• angularjs怎么实现checkbox选中触发事件
• 求javascript checkbox 选中事件代码
• 一个checkbox，点一下触发选中事件，再点一下触发不选中事件，不同事件不同函数怎么写
• 求javascript checkbox 选中事件代码
• angularjs怎么实现checkbox选中触发事件

js动态生成的checkbox取值和选中事件

《script type="text/javascript"》
window.onload = function() {
// 创建 input 元素
var checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.value = "123";
// 页面添加 checkbox
document.body.appendChild(checkbox);
// 点击
checkbox.onclick = function() {
if(this.checked) {
alert("选中");
}
else {
alert("未选中");
}
alert("value: " + this.value);
}
};
《/script》

checkbox的单击事件没有反应，选中任意复选框，其他两个复选框就取消选中，但是为什么js没有反应

因为你这从逻辑上来说是有冲突的，比如说当checkbox1选中时，你再点击checkbox2想让它选中（checkbox1和checkbox3则取消选中），这时程序执行到第一个if判断，由于checkbox1是选中的，因此checkbox2和checkbox3就会被取消选中（即使checkbox2被点击的瞬间是选中的），那么后面的第二个和第三个if判断就无论如何也不会执行了。
其实你改用单选框不就好了吗？连一行代码都不用写。复选框顾名思义就是用来多选的，强制让它单选简直是反人类啊。
如果非要用复选框，那就这样：
《script type="text/javascript"》
function check_count(id,me){
var checkbox1=document.getElementById("bzy1_"+id);
var checkbox2=document.getElementById("bzy2_"+id);
var checkbox3=document.getElementById("shy_"+id);
if(me.checked){
checkbox1.checked=checkbox1==me;
checkbox2.checked=checkbox2==me;
checkbox3.checked=checkbox3==me;
}
}
《/script》
然后调用的时候要这样：
onclick="check_count(’a’,this);"

checkbox 选中事件哪个

首先，checkbox是可以多选的，所以用alter提示选中的那个checkbox是不科学的，如果确实要这样做的话，可以使用onclick（）事件。《input type="checkbox value="checkbox1" onclick="alter(this.value)"》
如果要获取选中的checkbox，可以这样：
《input type="checkbox value="checkbox1" name="checkbox"》
《input type="checkbox value="checkbox2" name="checkbox"》
function getcheck(){
var x=document.getElementsByName("checkbox");
for (var i=0;i《x.length;i++)
{
alter(x.value +" is checked!");
}

checkbox 选中事件哪个

首先，checkbox是可以多选的，所以用alter提示选中的那个checkbox是不科学的，如果确实要这样做的话，可以使用onclick（）事件。《input type="checkbox value="checkbox1" onclick="alter(this.value)"》
如果要获取选中的checkbox，可以这样：
《input type="checkbox value="checkbox1" name="checkbox"》
《input type="checkbox value="checkbox2" name="checkbox"》
function getcheck(){
var x=document.getElementsByName("checkbox");
for (var i=0;i《x.length;i++)
{
alter(x.value +" is checked!");
}

angularjs怎么实现checkbox选中触发事件

html代码

《input type="checkbox" ng-click="sub()"》选择
《div ng-show="showType==1" class="btn"》
  《button type="submit"》提交申请《/button》
《/div》
《div ng-show="showType!=1" class="btn"》
  《button type="submit"》提交申请《/button》
《/div》

JavaScript代码：

var app = angular.module(’test’, );
app.controller(’chkCtrl’, function($scope){
    $scope.showType=1;
    $scope.sub = function(){
        $scope.showType=!$scope.showType;
    }
};

求javascript checkbox 选中事件代码

首先通过getElementById或其它方式获得这些对象obj，然后判断obj.checked = true或false就可以了。

例:

《input id=’bigclassauthorize’ type=’checkbox’ onclick=’testClickBigCheckBox()’/》

《input id=’smallclassauthorize1’ type=’checkbox’/》

《input id=’smallclassauthorize2’ type=’checkbox’/》

....

function testClickBigCheckBox(){

var big = document.getElementById(’bigclassauthorize’);

var small1 = document.getElementById(’smallclassauthorize1’);

var small2 = document.getElementById(’smallclassauthorize2’);

if(big.checked == true){

small1.checked = true;

small2.checked = true;

}else{

small1.checked = false;

small2.checked = false;

}

}

代码可以精简或者封装,这里只是简单的描述一下基本做法，以上是大项被选中的事件处理，小项的原理差不多。

扩展资料：

思路：获取checkbox对象，根据value属性设置checkbox的checked属性（true为选中，false为取消选中）。下面实例演示——根据文本框的制定值设置复选框的选中项：

1、HTML结构

《input name="test" type="checkbox" value="1" /》item-1

《input name="test" type="checkbox" value="2" /》item-2

《input name="test" type="checkbox" value="3" /》item-3《br》

《input name="test" type="checkbox" value="4" /》item-4

《input name="test" type="checkbox" value="5" /》item-5《br》

《input type="text" id="val"》《input type="button" value="确定" onclick="fun()"》

2、javascript代码

function fun(){

var val = document.getElementById("val").value.split(",");

var boxes = document.getElementsByName("test");

for(i=0;i《boxes.length;i++){

for(j=0;j《val.length;j++){

if(boxes){

boxes.checked = true;

break

}

}

}

}

一个checkbox，点一下触发选中事件，再点一下触发不选中事件，不同事件不同函数怎么写

//都是单击事件，判断选中状态调用不同结果

$("#checkbox的id").click(function(){

if($(this).attr("checked")==true){

//当前为选中状态

}else{

//当前为不选中状态

}

)};

CheckBox是在HTML中让使用者与首页上的素材发生交互作用的一种方法。其中包含CheckBox控件就是我们一般所说的复选框，通常用于某选项的打开或关闭。

CheckBox控件就是我们一般所说的复选框，通常用于某选项的打开或关闭。大多数应用程序的"设置"对话框内均有此控件。我们看到的可以打勾的就是CheckBox。

该控件表明一个特定的状态(即选项)是选定 (on，值为true) 还是清除 (off，值为false)。在应用程序中使用该控件为用户提供"True/False"或"yes/no"的选择。进行选项组合。

求javascript checkbox 选中事件代码

首先通过getElementById或其它方式获得这些对象obj，然后判断obj.checked = true或false就可以了。

例:

《input id=’bigclassauthorize’ type=’checkbox’ onclick=’testClickBigCheckBox()’/》

《input id=’smallclassauthorize1’ type=’checkbox’/》

《input id=’smallclassauthorize2’ type=’checkbox’/》

....

function testClickBigCheckBox(){

var big = document.getElementById(’bigclassauthorize’);

var small1 = document.getElementById(’smallclassauthorize1’);

var small2 = document.getElementById(’smallclassauthorize2’);

if(big.checked == true){

small1.checked = true;

small2.checked = true;

}else{

small1.checked = false;

small2.checked = false;

}

}

代码可以精简或者封装,这里只是简单的描述一下基本做法，以上是大项被选中的事件处理，小项的原理差不多。

扩展资料：

思路：获取checkbox对象，根据value属性设置checkbox的checked属性（true为选中，false为取消选中）。下面实例演示——根据文本框的制定值设置复选框的选中项：

1、HTML结构

《input name="test" type="checkbox" value="1" /》item-1

《input name="test" type="checkbox" value="2" /》item-2

《input name="test" type="checkbox" value="3" /》item-3《br》

《input name="test" type="checkbox" value="4" /》item-4

《input name="test" type="checkbox" value="5" /》item-5《br》

《input type="text" id="val"》《input type="button" value="确定" onclick="fun()"》

2、javascript代码

function fun(){

var val = document.getElementById("val").value.split(",");

var boxes = document.getElementsByName("test");

for(i=0;i《boxes.length;i++){

for(j=0;j《val.length;j++){

if(boxes){

boxes.checked = true;

break

}

}

}

}

angularjs怎么实现checkbox选中触发事件

html代码：
《input type="checkbox" ng-click="sub(1)"》选择
《div ng-show="showType==1" class="btn"》
《button type="submit"》提交申请《/button》
《/div》
《div ng-show="showType==2" class="btn"》
《button type="submit"》提交申请《/button》
《/div》
js代码：
var app = angular.module(’test’, );
app.controller(’chkCtrl’, function($scope){
$scope.showType=1;
$scope.sub = function(type){
if(type==1){
$scope.showType =2;
}
else if( $scope.showType ==2){
$scope.showType =1;
}
};
这代码点击勾选的时候有效