300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 11月8日下午Jquery取属性值(复选框 下拉列表 单选按钮) 做全选按钮 JSON存储 去空格...

11月8日下午Jquery取属性值(复选框 下拉列表 单选按钮) 做全选按钮 JSON存储 去空格...

时间:2020-12-19 03:41:58

相关推荐

11月8日下午Jquery取属性值(复选框 下拉列表 单选按钮) 做全选按钮 JSON存储 去空格...

1.jquery取复选框的值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><!--引入jquery包--><script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的--><style type="text/css"></style></head><body><input type="checkbox" value="01" class="ck" /><input type="checkbox" value="02" class="ck" /><input type="checkbox" value="03" class="ck" /><input type="checkbox" value="04" class="ck" /><input type="checkbox" value="05" class="ck" /><input type="button" value="取选中" id="btn" />

<script type="text/jscript">//取复选框的选中值$("#btn").click(function(){var ck = $(".ck");for(var i=0;i<ck.length;i++){//判断选中/*if(ck[i].checked){alert(ck[i].value);//js方法}*/if(ck.eq(i).prop("checked"))//prop判断是否选中 {alert(ck.eq(i).val());}}})</script>

</body></html>

2.取下拉列表里面的属性值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><!--引入jquery包--><script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的--><style type="text/css"></style></head><body><select id="sel"><option value="1111">1111</option><option value="2222">2222</option><option value="3333">3333</option></select><input type="button" value="取下拉" id="b1" />

<script type="text/jscript">$("#b1").click(function(){alert($("#sel").val());})</script>

</body>

</html>

3.取单选钮的属性值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><!--引入jquery包--><script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的--><style type="text/css"></style></head><body><input class="ck" type="radio" value="01" class="rd" name="a" /><input class="ck" type="radio" value="02" class="rd" name="a" /><input class="ck" type="radio" value="03" class="rd" name="a" /><input class="ck" type="radio" value="04" class="rd" name="a" /><input class="ck" type="radio" value="05" class="rd" name="a" /><input type="button" value="取单选" id="b2" />

<script type="text/jscript">$("#b2").click(function(){var ck = $(".ck");for(var i=0;i<ck.length;i++){if(ck.eq(i).prop("checked"))//prop判断是否选中 {alert(ck.eq(i).val());}}})</script>

</body></html>

4.jquery做全选按钮

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><!--引入jquery包--><script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的--><style type="text/css"></style></head><body><input type="checkbox" id="qx" />全选<input type="checkbox" value="01" class="ck" /><input type="checkbox" value="02" class="ck" /><input type="checkbox" value="03" class="ck" /><input type="checkbox" value="04" class="ck" /><input type="checkbox" value="05" class="ck" />

<script type="text/jscript">$("#qx").click(function(){/*if($(this)[0].checked){$(".ck").attr("checked","checked")}else{$(".ck").removeAttr("checked");}*///标记的这段代码中存在bug,不能用来做全选,要记住。用下面2行代码。var xz = $(this).prop("checked")//xz接收的值是true(选中)或者flase(未选中)$(".ck").prop("checked",xz)//如果是选中,就是true })</script>

</body></html>

5.js或jquery里面有数据存储方式

存储数据的名字叫做JSON

var json = {code:"n001",name:"张三",js:{c:"p001",n:"回族"}};//定义方式。定义比较随便,可以往里面放任意数据。//取值//alert(json.code)//取值方式//alert(json.js.n)//alert(json["name"])

6.去空格

var str= " hello ";str = str.trim();//不加取空格输出的长度是10,包含空格的长度。去掉空格输出的长度为5.alert(str.length)

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。