复选数据框

<!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 全选设定与设置选中的更多相关文章

  1. JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jq 全选、反选、判断选中的条数

    1.全选或全不选.当勾选全选按钮#selectAll旁边的复选框#all时,列表中的选项全部选中,反之取消勾选则列表中的选项全部为未选中状态. $("#all").click(fu ...

  3. jq 全选和反选以及判断那条被选中

    <body><div><input type="checkbox" id="a" />全选</div><d ...

  4. 基于JQ的多选/全选/反选及获取选中的值

    <!-- author:青芒 --> <!DOCTYPE html> <html lang="en"> <head> <met ...

  5. jQ全选效果

    <ul id="list"> <li><label><input type="checkbox" value=&quo ...

  6. ----Juquery复选框全选反选及获取选中值Value

    --获取选中值 var pList = ""; $("[name='ckdProd']").each(function () { if ($(this).is( ...

  7. 点击checkbox全选，其它被选中，再点击取消

    <input type="checkbox" value="" id="checkall" name="" siz ...

  8. jq全选、全不选、反选、单删、批量删除

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  9. JQ 全选、全不选

    $(document).ready(function() { $("#isalldebt").click(function() { if ($(this).attr("c ...

随机推荐

  1. 流媒体(音频 AudioStreamer)

    AudioStreamer 在github可以搜索到, 专门播放流媒体(音频)

  2. php配置中的register_globals用法

    开发的时候设置成register_globals=off,只能通过post或get得到前端数据． 参考资料:http://blog.csdn.net/alex_best/article/details ...

  3. [hihoCoder#1381]Little Y's Tree

    [hihoCoder#1381]Little Y's Tree 试题描述 小Y有一棵n个节点的树,每条边都有正的边权. 小J有q个询问,每次小J会删掉这个树中的k条边,这棵树被分成k+1个连通块.小J ...

  4. PHP微信支付开发实例

    这篇文章主要为大家详细介绍了PHP微信支付开发过程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 PHP微信支付开发过程,分享给大家,供大家参考,具体内容如下 1.开发环境 Thinkphp 3. ...

  5. 2015安徽省赛 H.数7

    http://xcacm.hfut.edu.cn/problem.php?id=1212 模拟大发 #include<iostream> #include<cstdio> #i ...

  6. c语言——gcc,make,vim

    在linux环境下进行c语言编程,基础的工具就是gcc和make.关于这2个工具的内容有很多,现在要做的仅仅是起步. gcc的用法: -S Compile only; do not assemble ...

  7. 蓝牙模块连接后出现ANR，日志记录

    11-25 16:29:48.433 14507-14561/myapplication.com.myblue W/MALI: glDrawArrays:714: [MALI] glDrawArray ...

  8. devstack两次以上重装提高成功率的方法

    1) /opt/stack/requirements/ git reset --hard 2) rm -rf /usr/local/lib/python2.7/dist-packages/*

  9. JavaScript——callback（回调函数

    1.回调函数定义 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数.回调函数不是由该函数的实现方直 ...

  10. 在asp.net mvc中上传大文件

    在asp.net mvc 页面里上传大文件到服务器端,需要如下步骤: 1. 在Control类里添加get 和 post 方法 // get method public ActionResult Up ...