JQ 全选设定与设置选中
复选数据框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
</head> <body>
<div>全选<input type="checkbox" id="qx" /></div>
<div>
植物园<input type="checkbox" class="ck" value="植物园" />
公园<input type="checkbox" class="ck" value="公园" />
医院<input type="checkbox" class="ck" value="医院" />
餐厅<input type="checkbox" class="ck" value="餐厅" />
</div><br />
<div><input type="button" value="取值" id="btn" /></div><br />
<div>
请输入区域:<input type="text" id="qy" />
<input type="button" value="设置选中" id="szxz" />
</div>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#qx").click(function(){
//找到全选按钮的选中状态
var xz=$(this).prop("checked");
//将复选框列表里面所有的复选框的选中状态变为全选的选择状态
$(".ck").prop("checked",xz);
})
$("#btn").click(function(){ var ck=$(".ck"); for(var i=0;i<ck.length;i++)
{
//取JQUERY对象
//ck.eq(i).prop("checked");
//取DOM对象
//ck[i].checked if(ck.eq(i).prop("checked"))
{
alert(ck.eq(i).val());
}
}
}) $("#szxz").click(function(){ //获取用户输入的值
var qy=$("#qy").val();
//设置选中
var ck=$(".ck"); ck.prop("checked",false); for(var i=0;i<ck.length;i++)
{
if(ck.eq(i).val()==qy)
{
ck.eq(i).prop("checked",true);
}
} }) }); </script>
</html>
单选数据框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
</head> <body>
<div>
植物园<input type="radio" name="qy" class="ck" value="植物园" />
公园<input type="radio" name="qy" class="ck" value="公园" />
医院<input type="radio" name="qy" class="ck" value="医院" />
餐厅<input type="radio" name="qy" class="ck" value="餐厅" />
</div><br />
<div><input type="button" value="取选中值" id="btn" /></div>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(){ var ck=$(".ck");
//利用for循环输出
for(var i=0;i<ck.length;i++)
{
if(ck.eq(i).prop("checked"))
{
alert(ck.eq(i).val());
}
} })
}); </script>
</html>
下拉数据条
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery-1.11.2.min.js"></script>
</head> <body>
<select id="qy">
<option value="1">所有</option>
<option value="植物园">植物园</option>
<option value="公园">公园</option>
<option value="医院">医院</option>
<option value="餐厅">餐厅</option>
</select>
<input type="button" value="取选中值" id="btn" /><br />
<div>请输入:
<input type="text" id="zhi" />
<input type="button" value="设置选中" id="szxz" />
</div>
</body>
<script type="text/javascript">
$(document).ready(function(e) {
$("#btn").click(function(){ alert($("#qy").val()); }) $("#szxz").click(function(){ var zhi=$("#zhi").val(); var op=$("option"); /*for(var i=0;i<op.length;i++)
{
//op.eq(i).prop("selected");
if(op.eq(i).val()==zhi)
{
op.eq(i).prop("selected",true);
}
}*/ $("#qy").val(zhi); })
});
</script>
</html>
JQ 全选设定与设置选中的更多相关文章
- JQuery 判断checkbox是否选中,checkbox全选,获取checkbox选中值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jq 全选、反选、判断选中的条数
1.全选或全不选.当勾选全选按钮#selectAll旁边的复选框#all时,列表中的选项全部选中,反之取消勾选则列表中的选项全部为未选中状态. $("#all").click(fu ...
- jq 全选和反选以及判断那条被选中
<body><div><input type="checkbox" id="a" />全选</div><d ...
- 基于JQ的多选/全选/反选及获取选中的值
<!-- author:青芒 --> <!DOCTYPE html> <html lang="en"> <head> <met ...
- jQ全选效果
<ul id="list"> <li><label><input type="checkbox" value=&quo ...
- ----Juquery复选框全选反选及获取选中值Value
--获取选中值 var pList = ""; $("[name='ckdProd']").each(function () { if ($(this).is( ...
- 点击checkbox全选,其它被选中,再点击取消
<input type="checkbox" value="" id="checkall" name="" siz ...
- jq全选、全不选、反选、单删、批量删除
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...
- JQ 全选、全不选
$(document).ready(function() { $("#isalldebt").click(function() { if ($(this).attr("c ...
随机推荐
- 使用srvany.exe将任何程序作为Windows服务运行
使用srvany.exe将任何程序作为Windows服务运行 2011 年 3 月 7 日 !本文可能 超过1年没有更新,今后内容也许不会被维护或者支持,部分内容可能具有时效性,涉及技术细节或者软件使 ...
- 用 ROS 做内网DNS服务器
转载:http://iliuyong.iteye.com/blog/1035692 用 ROS 做内网DNS服务器方法:1.ROS 设置IP ->DNS 选择"static" ...
- SQL 数据库初学笔记一
做web刚好用得上SQL和php,图书馆借来书,来一个一晚上速成 <SQL必知必会>笔记 通用的语法,相关分类执行程序(DBMS): Apache Open Office Base Ado ...
- BZOJ 1461: 字符串的匹配
Description 同上题. Sol KMP+树状数组. 写这题的时候我灰常naive...不管了...直接贴代码... Code /******************************* ...
- ASIO插件 真的能提升 音质?(听音乐者必看)
最近在倒弄HIFI音乐播放器footbar2000的配置时,发现了2011年的一个神贴, 最牛逼的是,这个神贴到现在还屹立不倒,还有很多无知的人在下面膜拜, 我真的想问:你这么优秀,都能逆天反转音质, ...
- phpcms调用某个栏目下的所有二级栏目
在html中直接这样调用就可以了,subcat中的值为父栏目的catid {loop subcat(93) $r}{/loop} 注意subcat方法的参数,如果只写一个参数,也就是父栏目id,那该父 ...
- discuzX3后台管理插件开发示例一 用户表查询
上次的入门已经介绍了后台管理插件开发的基本步骤,下面简单写一个示例查询一下用户表 需要已完成以下操作: 1.已创建test后台管理插件 //详见 http://www.cnblogs.com/savo ...
- td的title属性
今天才知道html元素td还有一个title属性,就是一个tooltip的东西,即当你把鼠标放在td上面的时候,会弹出一个提示语,这个提示语就是td的title. 把td的文本赋值给title: ht ...
- PHP socket编程需要了解的一些基本知识
前面讲到了 fsockopen 的各种情况,其中涉及了很多其它知识,比如chunked分段传输,Keep-Alive,HTTP头字段等额外的知识,如果对这些知识一知半解,会影响对 PHP 的 sock ...
- UINavigationItem UINavigationBar 关系分析
目录 1.关系分析 2.关系综述 3.概念点 4.疑问 1.关系分析 UIBarItem-> UIBarButtonItem -> UINavigationItem 1.1 UIBarIt ...