单选：

　　获取值：$("input[name='rdo']:checked").val();

　　设置值：$("input[name='rdo'][value='3']").prop("checked", true)

　　　　　　$("input[name='rdo']:eq(2)").prop("checked", true)

　　　　　　$("input[name='rdo']").eq(2).prop("checked", true)

　　　　　　$("input[name='rdo']").get(2).checked = true

多选：

　　获取值：　　　　　　

function getCheckedValues() {

    var arr = new Array();

    $("input[name='chk']:checked").each(function() {

        arr.push($(this).val());

    });

    return arr.join(",");

}

　　设置值：

　　　　　　$("input[name='chk']").val(["2", "3"])

　　　　　　$("input[name='chk']").val("2,3".split(","))

select单选：

　　获取值：$("#drp").val()    说明：.val()处理select元素， 当没有选择项被选中，它返回null

　　设置值：$("#drp").val(3)

select多选：　　

　　获取值：　$("#selectDuo").val()　

　　设置值：同上面的多选框

<html>

<head>

    <title></title>

    <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>

    <style type="text/css">

        div {

            padding: 10px;

        }

        hr{border-bottom: solid 1px #ccc;line-height:10px;width:100%}

    </style>

    <script>

        //单选 begin******************************************************************

        //获取单选值

        function getRadioValue() {

            var val = $("#dan input[name='rdo']:checked").val();

            $("#info").html(val);

        }

        //根据值或索引选中

        function setRadioValue() {

            //1.根据值选中radio

            $("#dan input[name='rdo'][value='3']").prop("checked", true);

            //2.根据索引选中radio

            //$("#dan input[name='rdo']:eq(2)").prop("checked", true);

            //3.根据索引选中radio

            //$("#dan input[name='rdo']").eq(2).prop("checked", true);

            //4.根据索引选中radio

            //$("#dan input[name='rdo']").get(2).checked = true;

        }

        //单选 end******************************************************************

        //多选 begin******************************************************************

        //获取多选值，多个以逗号分隔

        function getCheckboxValue() {

            var arr = new Array();

            $("#duo input[name='chk']:checked").each(function () {

                arr.push($(this).val());

            });

            $("#info").html(arr.join(","));

        }

        //设置多选

        function setCheckboxValue() {

            //1.根据数组值选中

            //$("#duo input[name='chk']").val(["2", "3"]);

            //2.根据字符串值选中

            var vals = "2,3"

            $("#duo input[name='chk']").val(vals.split(","));

        }

        //多选 end******************************************************************

        //下拉***********************************************************************

        function getSelectValue() {

            var val = $("#drp").val();

            $("#info").html(val);

            //var val = $("#drp :checked").val();

        }

        //设置多选

        function setSelectValue() {

            var val = $("#drp").val("3");

        }

        //select多选 begin**************************************************************

        function getSelectDuoValue() {

　　　　　　　　var val = $("#selectDuo").val();
　　　　　　　　$("#info").text(val);

        }

        //设置多选

        function setSelectDuoValue() {

            var val = $("#selectDuo").val(["2","3"]);

        }

        //select多选 end**************************************************************

    </script>

</head>

<body>

    <div style="color:#f00">结果：<span id="info" style="height:30px"></span></div>

    <div id="dan">

        <input type="radio" name="rdo" id="radio1" value="1" />1

        <input type="radio" name="rdo" id="radio2" value="2" />2

        <input type="radio" name="rdo" id="radio3" value="3" />3

        <input type="radio" name="rdo" id="radio4" value="4" />4

    </div>

    <div>

        <input type="button" value="获取当前值" onclick="getRadioValue()" />

        <input type="button" value="设置值为3的选中" onclick="setRadioValue()" />

    </div>

    <hr />

    <div id="duo">

        <input type="checkbox" name="chk" id="checkbox1" value="1" />1

        <input type="checkbox" name="chk" id="checkbox2" value="2" />2

        <input type="checkbox" name="chk" id="checkbox3" value="3" />3

        <input type="checkbox" name="chk" id="checkbox4" value="4" />4

    </div>

    <div>

        <input type="button" value="获取当前值" onclick="getCheckboxValue()" />

        <input type="button" value="设置值为2,3的选中" onclick="setCheckboxValue()" />

    </div>

    <hr />

    <div>

        <select id="drp">

            <option value="1">1</option>

            <option value="2">2</option>

            <option value="3">3</option>

            <option value="4">4</option>

        </select>

    </div>

    <div>

        <input type="button" value="获取当前值" onclick="getSelectValue()" />

        <input type="button" value="设置值为3的选中" onclick="setSelectValue()" />

    </div>

    <hr />

    <div>

        <select id="selectDuo" multiple="multiple">

            <option value="1">111111</option>

            <option value="2">222222</option>

            <option value="3">333333</option>

            <option value="4">444444</option>

        </select>

    </div>

    <div>

        <input type="button" value="获取当前值" onclick="getSelectDuoValue()" />

        <input type="button" value="设置值为2,3的选中" onclick="setSelectDuoValue()" />

    </div>

</body>

</html>

获取或设置checkbox radio select的值的更多相关文章

  1. jquery 获取和设置 checkbox radio 和 select option的值?

    ============== 获取和设置 checkbox radio 和 select的值? === val()函数, 其名字就表达了 它的意思: 他就是＝ value 的简写! val就是valu ...

  2. struts2学习笔记之表单标签的详解:s:checkbox/radio/select/optiontransferselect/doubleselect/combobox

    struts2中的表单标签都是以s标签的方式定义的,同时,struts2为所有标签都提供了一个模板,C:\Users\180172\Desktop\struts2-core-2.2.1.1.jar\t ...

  3. checkbox radio select绑定

    index11.html <html><head> <title>checkbox radio select绑定</title> <script ...

  4. .NET Core程序中，如何获取和设置操作系统环境变量的值

    有时候我们在.NET Core程序中需要获取和设置操作系统环境变量的值.本文演示如何使用Environment.GetEnvironmentVariable和Environment.SetEnviro ...

  5. java 中利用反射机制获取和设置实体类的属性值

    摘要: 在java编程中,我们经常不知道传入自己方法中的实体类中到底有哪些方法,或者,我们需要根据用户传入的不同的属性来给对象设置不同的属性值,那么,java自带的反射机制可以很方便的达到这种目的,同 ...

  6. java反射获取和设置实体类的属性值 递归所有父类

    最近做一个通用数据操作接口,需要动态获取和设置实体类的属性值,为了通用实体做了多重继承,开始网上找到代码都不支持父类操作,只能自己搞一个工具类了,此工具类可以设置和获取所有父类属性,代码贴下面拿走不谢 ...

  7. Jquery常用操作：checkbox、select取值，radio、checkbox、select选中及其相关

    常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐 ...

  8. 七、React表单详解 约束性和非约束性组件 input text checkbox radio select textarea 以及获取表单的内容

    一.约束性和非约束性组件: 非约束性组: MV: <input type="text" defaultValue="a" /> 这个 default ...

  9. Jquery 获取 radio/select选中值

    Radio <input type="radio" name="rd" id="rd1" checked="checked& ...

随机推荐

  1. POJ3468--A Simple Problem with Integers（Splay Tree）

    虽然有点难,但是这套题都挂了一个月了啊喂…… 网上模板好多……最后还是抄了kuangbin聚聚的,毕竟好多模板都是抄他的,比较习惯…… POJ 3468 题意:给n个数,两种操作,区间整体加一个数,或 ...

  2. Activity的lanuchmode

    假设: 假设栈有A-B-C-D,四个activity.其中D Activity在栈顶 standard: 此时跳转到D Activity,跳转后栈的情况是A-B-C-D-D singleTop: 此时 ...

  3. Android实例-操作摄像头(XE8+小米2)

    结果: 1.同样是照相,自己的程序设置为高质量时刷新慢,而小米手机的相机那真心反映快呀. 2.就算我设置为最高质量,可相片也没有小米手机的相片大.我最大是2000*1000,而小米可以做到3000*2 ...

  4. 转载 深入理解JavaScript中的this关键字

    转载原地址: http://www.cnblogs.com/rainman/archive/2009/05/03/1448392.html 深入理解JavaScript中的this关键字   1. 一 ...

  5. IOS 支付

    支付:http://www.cnblogs.com/wangerxiansheng/p/4498586.htmlhttp://www.cnblogs.com/iCocos/p/4598548.html ...

  6. ECSHOP在线手册布局参考图--商品分类页 category.dwt

        A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...

  7. 使用openssl库实现des,3des加密

    原文地址: 使用openssl库实现des,3des加密 主要是调整了一下格式,以及一些变量的类型,以解决在VC2008下无法编译通过的问题. #include <stdio.h> #in ...

  8. linux ssh 配置 添加用户 另外一种方法

    [root@localhost ~]# vi /etc/pam.d/sshd #%PAM-1.0auth       required     pam_stack.so service=system- ...

  9. 【转】安装Ubuntu 15.10后要做的事

    Ubuntu 15.10发布了,带来了很多新特性,同样也依然带着很多不习惯的东西,所以装完系统后还要进行一系列的优化. 1.删除libreoffice libreoffice虽然是开源的,但是Java ...

  10. js url传值中文乱码之解决之道

    在websphere 中使用的是url=encodeURI(encodeURI(url)); //用了2次encodeURI 测试成功,第一次转换没有尝试, 处理方法一. js 程序代码:url=en ...