firefox中 checkbox属性checked="checked"已有,但复选框却不显示打钩的原因

最近在调试复选框的应用,在ie没有问题,考虑到兼容性,试试了firefox,遇到了问题。

复选框绑定了click事件,点一次选中,再点击取消选中,依次类推。这个功能在ie中没问题,但是在firefox中测试的时候,前两次都没有问题,可以正常显示选中和取消,但当再去选中的时候,复选框的属性checkbox值变为"checked",没问题,但是复选框却不在显示选中状态,明明属性值改了,但是却不显示勾选,太诡异了。代码修改了却得不到正确的显示状态,纠结了很久,找不到原因。

正解:后来经偶像指点,原来是jQuery版本问题。我操作属性用的是

$("**").attr("attrName");而jQuery的版本用的是1.9,这就是存在一个兼容性和稳定性问题。

jQuery API明确说明,1.6+的jQuery要用prop,尤其是checkBox的checked的属性的判断,即

$("input[type=‘checkbox‘]").prop("checked");

$("input[type=‘checkbox‘]").prop("disabled", false);
$("input[type=‘checkbox‘]").prop("checked", true);

在使用是将attr改为prop,问题得解。

你遇到这个奇怪的问题了吗?赶紧试试吧~~

时间: 2024-10-14 21:43:35

firefox中 checkbox属性checked="checked"已有,但复选框却不显示打钩的原因的相关文章

sharepoint中根据“是/否(复选框)”的值显示隐藏指定栏

sharepoint中根据“是/否(复选框)”的值显示隐藏指定栏 function HideColumn(targetColumn, hideColumn) { var columnObj = $("input[Title='" + hideColumn + "']"); $("input[Title='" + targetColumn + "']").bind('click',function() { if($(this).

firefox(火狐)下 js中设置checkbox属性checked="checked"已有,但复选框却不显示勾选的原因

刚看到问题时以为是浏览器兼容性的原因,ie.google都能正常显示. 网上查询之后发现是jQuery的attr()方法用的不恰当. jQuery1.6之前使用attr()可以修改 ,从jQuery 1.6开始,attr()方法返回undefined尚未设置的属性,对于设置checked这种类型的属性使用prop()来设置. jquey官网给出的两个方法的说明: 获取匹配元素集中第一个元素的属性值,或为每个匹配元素设置一个或多个属性. 并指出检索和修改DOM属性,如checked,selecte

复选框checked 选中后不显示打钩

checkbox属性checked="checked"已有,但复选框却不显示打钩的原因 复选框绑定了click事件,点一次选中,再点击取消选中, 第一次,可以正常显示选中和取消,但当再去选中的时候,复选框的属性checkbox值变为"checked",没问题,但是复选框却不在显示选中状态,F12发现属性值改了checked,但是却不显示勾选,太诡异了.代码修改了却得不到正确的显示状态,纠结了很久,找不到原因. 正解:后来经偶像指点,原来是jQuery版本问题.我操作

jquery中input复选框的checked属性

在今日的多选,反选,全选试验中,关于通过jQuery方法来实现复选框的选中与否问题,我有了以下发现: 1.不能通过.css('checked','checked')方法来设置或者获取复选框的checked属性,在控制台打印输出.css('checked'),结果为undefined, 不管在HTML中是否设置了checked='checked'; 2.通过attr添加属性即.attr('checked','abc'),会给HTML中input所在处添加checked='checked'这样的代码

纯CSS自定义Html中Checkbox复选框样式

原文链接:http://www.lrxin.com/archives-683.html 首先看下效果: 点击演示地址查看实例. 首先,需要添加一段CSS隐藏所有的Checkbox复选框,之后我们会改变它的外观. 要做到这一点需要添加一段代码到你的CSS文件中. /** * 隐藏默认的checkbox */ input[type=checkbox] { visibility: hidden; } 隐藏掉所有的Checkbox复选框后,我们需要添加一个label HTML元素,我们都知道,当点击的有

html,javaScript中怎么控制复选框checkbox的全选,全不选,以及全选中,全选按钮选中,其中一个或者多个没选,则全选按钮不被选中

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><%@ include file="/commons/jsp/htmtag.jsp"%> <html><head> <meta http-equiv="Content-Type"

【转载】checkbox复选框的一些深入研究与理解

转载来自:原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com] 一.一开始的唠叨最近忙于开发,自淫于项目的一步步完工,心浮躁了.舍近而求远,兵家之大忌.我是不是应该着眼于眼前的东西,好好的静下心来,超过一般人的沉静与沉浸,研究最基本的东西呢?这番思考,让我找到了一些方向. 对于checkbox,从我开始接触HTML开始,陆陆续续也研究过好多次,然而多是零星的知识点的累加,或是掌握了些表象的东西,是否深入核心,是否深入其本质,是否有了完善的总结,是否

jQuery实现的checkbox复选框全选和全不选效果

jQuery实现的checkbox复选框全选和全不选效果:复选框的全选和全不选效果在代码中非常的常用,尤其在批量处理的需求中更是如此,下面就通过一个代码实例简单介绍一下如何实现此效果,希望能够对需要的朋友有所帮助,代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http:

判断复选框中是否有被选中的代码实例

判断复选框中是否有被选中的代码实例:复选框中一般多项,有时候我们需要判断这些付选中是否有被选中的项,下面就通过一个实例简单介绍一下如何实现此效果.代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"/> <meta name="author" content="http://www.softwhy.com/" /> <t