解决checkbox属性checked为true但是未被选中的问题

本文探讨了jQuery中属性和属性方法的区别,特别是在不同版本中取属性时的行为变化,特别关注了1.6版本之后的变化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原来是jQuery版本问题。

Attributes vs. Properties

attributesproperties之间的差异在特定情况下是很重要。jQuery 1.6之前 ,.attr()方法在取某些 attribute 的值时,会返回 property 的值,这就导致了结果的不一致。从 jQuery 1.6 开始, .prop()方法 方法返回 property 的值,而.attr() 方法返回 attributes 的值。

例如, selectedIndextagNamenodeNamenodeTypeownerDocumentdefaultChecked, 和 defaultSelected应使用.prop()方法进行取值或赋值。 在jQuery1.6之前,这些属性使用.attr()方法取得,但是这并不是元素的attr属性。他们没有相应的属性(attributes),只有特性(property)。



<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<title>checkbox 全选 反选</title>
</head>
<body>
	<div class="warp" style="margin:100px">
		<div class="checktype">
			<label>全选<input type="radio" name="checktype" id="checkall" /></label>
			<label>反选<input type="radio" name="checktype" id="checkback" /></label>
		</div>
		<div class="checkbox">
			<table>
				<tr>
				    <td><input type="checkbox" />1</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />2</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />3</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />4</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />5</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />6</td>
				</tr>
				<tr>
				    <td><input type="checkbox" />7</td>
				</tr>
			</table>
		</div>
	</div>
	<script type="text/javascript" src="../jquery-1.11.0.min.js"></script>
	<script type="text/javascript">
		$(function(){

			$("#checkall").click(function(){
				if(this.checked){
					$(".checkbox input[type=checkbox]").prop("checked",true);
				}else{
					$(".checkbox input[type=checkbox]").prop("checked",false);
				}
			});

			$("#checkback").click(function(){
				var back = $(".checkbox input[type=checkbox]");
				back.each(function(){
					console.log(this.checked);
					if( this.checked ){
						$(this).prop("checked",false);
					}else{
						$(this).prop("checked",true);
					}
					
				});
			});
		})
	</script>
</body>
</html>


### Android RadioButton `android:checked="true"` 显示选中原因 当在 XML 中设置 `android:checked="true"` 时,RadioButton 可能会显示为选中状态。这通常是由以下几个因素引起的: #### 1. 自定义 Drawable 影响 如果自定义了 `android:button` 或者使用了 `android:drawableStart` 等属性设置了图标资源文件,则可能导致 CheckBox 的视觉反馈出现问题[^1]。 ```xml <RadioButton android:id="@+id/radio_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Option" android:checked="true" android:drawableStart="@drawable/sel_detail_table_grid"/> ``` 上述代码片段展示了如何通过 `android:drawableStart` 设置左侧图标的例子。若该 drawable 资源存在问题或样式冲突,可能会干扰默认的选择效果。 #### 2. OnCheckedChangeListener 干扰 即使监听器接收到正确的 checked 状态变化通知,在某些情况下仍可能出现界面更新失败的情况。确保没有其他地方重置了控件的状态。 #### 解决方案 为了修复这个问题,建议采取以下措施之一: - **移除不必要的 Drawable 属性**:尝试去掉任何可能影响到原生外观的额外绘制配置项。 - **程序化设定 Checked 状态**:除了静态声明外,还可以考虑动态调整其初始值: ```java // Java Code Example RadioButton radioButton = findViewById(R.id.radio_button); radioButton.setChecked(true); ``` 这样做能够绕过潜在的布局解析阶段错误,并强制应用最新的 UI 更新逻辑。 - **验证 Style 和 Theme 定义**:确认当前主题下的 ButtonStyle 是否覆盖了标准行为,必要时可指定特定样式的继承关系以保持一致性。 ---
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值