jquery下checked取值问题的解决方法
更新时间：2012年08月09日 20:59:34 作者：
修改checkbox时..jquery在取checked值时总是出这样那样的问题....各个版本之间还有少许的差异....当向后台发送数据后,,再返回到当前页时..checked的状态始终不对
一怒之下,给checkbox加一个isCheck,,不用那该死的checked属性...一切OK了...代码如下:
<!DOCTYPE html >
<html><head>
<meta charset="UTF-8">
<title>修复checkbox的状态切换和动态取值的问题</title>
<script type="text/javascript" src="jquery.js"></script>
<style>
* {margin:0; padding:0;}
ul li { float:left; list-style:none; margin-left:20px;}
</style>
</head>
<body>
<form name="journal" id="journal" action="#" method="post">
<input name="cate_ids" value="" type="hidden">
<ul>
<li><input checked="checked" isCheck="true" class="ckbox" value="1" name="cate_id" type="checkbox">美食1</li>
<li><input class="ckbox" value="2" name="cate_id" type="checkbox">美食2</li>
<li><input class="ckbox" value="3" name="cate_id" type="checkbox">美食3</li>
<li><input checked="checked" isCheck="true" class="ckbox" value="4" name="cate_id" type="checkbox">美食4</li>
<li><input checked="checked" isCheck="true" class="ckbox" checked="checked" value="5" name="cate_id" type="checkbox">美食5</li>
</ul>
<div class="btn"> <input value="确认" name="sbtn" onclick="getValues()" type="button">
</form>
<script>
//修复checkbox的状态切换和动态取值的问题
//为checkbox新增一个isCheck属性来替换checked属性的不兼容性
$(".ckbox").click(function(){
if($(this).attr("isCheck") == "true") {
$(this).removeAttr("isCheck")
} else {
$(this).attr("isCheck", "true");
}
})
function getValues()
{
var list="";
$(".ckbox").each(function(){
if($(this).attr("isCheck") == "true"){
list += $(this).val() + ",";
}
})
alert(list);
}
</script>
</body>
</html>
复制代码 代码如下:
<!DOCTYPE html >
<html><head>
<meta charset="UTF-8">
<title>修复checkbox的状态切换和动态取值的问题</title>
<script type="text/javascript" src="jquery.js"></script>
<style>
* {margin:0; padding:0;}
ul li { float:left; list-style:none; margin-left:20px;}
</style>
</head>
<body>
<form name="journal" id="journal" action="#" method="post">
<input name="cate_ids" value="" type="hidden">
<ul>
<li><input checked="checked" isCheck="true" class="ckbox" value="1" name="cate_id" type="checkbox">美食1</li>
<li><input class="ckbox" value="2" name="cate_id" type="checkbox">美食2</li>
<li><input class="ckbox" value="3" name="cate_id" type="checkbox">美食3</li>
<li><input checked="checked" isCheck="true" class="ckbox" value="4" name="cate_id" type="checkbox">美食4</li>
<li><input checked="checked" isCheck="true" class="ckbox" checked="checked" value="5" name="cate_id" type="checkbox">美食5</li>
</ul>
<div class="btn"> <input value="确认" name="sbtn" onclick="getValues()" type="button">
</form>
<script>
//修复checkbox的状态切换和动态取值的问题
//为checkbox新增一个isCheck属性来替换checked属性的不兼容性
$(".ckbox").click(function(){
if($(this).attr("isCheck") == "true") {
$(this).removeAttr("isCheck")
} else {
$(this).attr("isCheck", "true");
}
})
function getValues()
{
var list="";
$(".ckbox").each(function(){
if($(this).attr("isCheck") == "true"){
list += $(this).val() + ",";
}
})
alert(list);
}
</script>
</body>
</html>
相关文章
这篇文章主要为大家详细介绍了jquery.pagination.js分页使用教程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-10-10
为了让本地图片、远程图片、过小的图片都适应此插件，有很多细节问题要处理。2009-11-11
这篇文章主要为大家详细介绍了jquery.multiselect 多选下拉框实现代码,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
JQuery Dialog(JS 模态窗口,可拖拽的DIV)
JQuery Dialog(JS模态窗口,可拖拽的DIV) 效果实现代码2010-02-02
用jQuery将元素移除的基本方法常用的有三个，一个是remove()方法，一个是html()方法，一个是empty()方法2014-05-05
这篇文章主要为大家详细介绍了jQuery实现可编辑的表格，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-12-12
jquery中append()与appendto()用法分析
这篇文章主要介绍了jquery中append()与appendto()用法分析,以实例的形式分析了jquery中append()与appendto()的具体语法与详细用法,需要的朋友可以参考下2014-11-11
基于jQuery+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
上次发了几个jQuery的插件和些心得, 很多园友(也许是自己站上的)发邮件希望能提供更多的源码, 正好这次有个同学希望在自己的坛子上挂个图片裁剪以生成头像的功能, 于是帮忙写了这么个插件.也许很多园友用得着, 就一并发上来啦.2011-09-09
这篇文章主要介绍了jQuery UI插件自定义confirm确认框的方法,实例分析了jQuery的UI插件使用技巧,非常具有实用价值,需要的朋友可以参考下2015-03-03
这篇文章主要为大家详细介绍了jquery.pager.js分页的实现方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-07-07
最新评论