首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

jquery 1.9版本停复选框 全选 及 取值操作

2013-11-15 
jquery 1.9版本下复选框全选 及 取值操作!DOCTYPE Htmlhtml??? head??????? script typetext/jav

jquery 1.9版本下复选框 全选 及 取值操作

<!DOCTYPE Html>
<html>
??? <head>
??????? <script type="text/javascript" src="c:/jquery.js"></script>
??????? <script type="text/javascript">
??????????? function selectAll(checkbox) {
??? ??? ??? ?? //1、 1.9以前的方法
?????????????? // $('input[type=checkbox]').prop('checked', $(checkbox).prop('checked'));
??? ??? ??? ?? //2.以下代码,官方代码?
??? ??? ??? ??? ? $("input[name='chk_list']").prop("checked", function(i, val) {?
??????????????????????? return !val;?
????????????????? });?
????????????? }
????????????????
??? ??? ??? ?$(function(){?????
??? ??? ??? ??? ?? $("input[type=checkbox]").click(function(){
??? ??? ??? ??? ??? ? var str = "";
??? ??? ??? ??? ??? ? $("input:checkbox:checked").each(function() {
??? ??? ??? ??? ??? ??? ?str+=$(this).val();
??? ??? ??? ??? ??? ?? });
??? ??? ??? ??? ??? ? //alert(str);
?????????????????????? $("#inputCheckboxId").val(str);
??? ??? ??? ??? ?? });
??? ??? ??? ?});
??????? </script>
??? </head>
??? <body>
??????? <input type="checkbox" onclick="selectAll(this);" value=""/>全选<br/>
??????? <input type="checkbox" name="chk_list" id="chk_list_1" value="1" />1<br />
??????? <input type="checkbox" name="chk_list" id="chk_list_2" value="2" />2<br />
??????? <input type="checkbox" name="chk_list" id="chk_list_3" value="3" />3<br />
??????? <input type="checkbox" name="chk_list" id="chk_list_4" value="4" />4<br />
??? ??? <input id="inputCheckboxId" /><br />
??? </body>
</html>

热点排行