<!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>

    <title></title>

    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $("#getValue").click(function () {

                alert($(":radio[name=gender]:checked").val());

            });

            $("#setValue").click(function () {

                $(":radio[name=gender]").val(["保密"]); //给radio设值（选中）时要添加中括号[]

            });

        });

        /*****选中多个*******/

        $(function () {

            $("#checkBtn").click(function () {

                $(":checkbox").val(["羽毛球", "篮球"]);

            });

        });

    </script>

</head>

<body>

    <input type="radio" value="男" name="gender" />男<br />

    <input type="radio" value="女" name="gender" />女<br />

    <input type="radio" value="保密" name="gender" />保密<br />

    <input type="button" value="取值" id="getValue" />

    <input type="button" value="设置" id="setValue" />

    <br />

    <br />

    <br />

    <input type="checkbox" value="篮球" />篮球

    <input type="checkbox" value="足球" />足球

    <input type="checkbox" value="乒乓球" />乒乓球

    <input type="checkbox" value="冰球" />冰球

    <input type="checkbox" value="羽毛球" />羽毛球

    <input type="checkbox" value="橄榄球" />橄榄球

    <input type="button" id="checkBtn" value="选中多个" />

</body>

</html>

JQ 操作样式，单选按钮跟复选框的更多相关文章

  1. 【特效】单选按钮和复选框的美化（只用css）

    表单的默认样式都是比较朴素的,实际页面中往往需要美化他们.这里先说说单选按钮和复选框,有了css3,这个问题就变的好解决了.利用input与label相关联,对label进行美化并使其覆盖掉原本的in ...

  2. UI设计规范：单选按钮 vs 复选框，没那么简单

    无论是网页设计,还是移动app设计,都经常用到单选按钮和复选框这两个组件.这两个组件看似意义明确,很好区分,但在实际设计中却很容易用错,带来不好的用户体验. 本文中我通过列举几个典型的错误用法,帮助设 ...

  3. mui开发中获取单选按钮、复选框的值

    js获取单选按钮的值 function getVals(){ var res = getRadioRes('rds'); if(res == null){mui.toast('请选择'); retur ...

  4. [ PyQt入门教程 ] PyQt5基本控件使用:单选按钮、复选框、下拉框

    本文主要介绍PyQt5界面最基本使用的单选按钮.复选框.下拉框三种控件的使用方法进行介绍. 1.RadioButton单选按钮/CheckBox复选框.需要知道如何判断单选按钮是否被选中. 2.Com ...

  5. 20151215单选按钮列表,复选框列表:CheckBoxList

    单选框:RadioButton GroupName:组名,如果要实现单选效果每个单选按钮的组名必须一样 是否被选中 RadioButton.checked 单选按钮列表:RadioButtonList ...

  6. DOM（十）使用DOM设置单选按钮、复选框、下拉菜单

    1.设置单选按钮 单选按钮在表单中即<input type="radio" />它是一组供用户选择的对象,但每次只能选一个.每一个都有checked属性,当一项选择为t ...

  7. js自定义修改复选框单选框样式，清除复选框单选框默认样式

    之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...

  8. 自定义复选框 checkbox 样式

    默认的复选框样式一般在项目中都很少用 ,看起来也丑丑的.这里提供一个优化样式后的复选框.原理就是隐藏掉默认样式,在用设计好的样式替代 html结构 <div> <input type ...

  9. 3.Android之单选按钮RadioGroup和复选框Checkbox学习

    单选按钮和复选框在实际中经常看到,今天就简单梳理下. 首先,我们在工具中拖进单选按钮RadioGroup和复选框Checkbox,如图: xml对应的源码: <?xml version=&quo ...

随机推荐

  1. UIView的动画之初步学习

    animateWithDuration:<#(NSTimeInterval)#> delay:<#(NSTimeInterval)#> options:<#(UIView ...

  2. Ngui _CD技能特效

    using UnityEngine;using System.Collections; public class Skill : MonoBehaviour { public float coldTi ...

  3. C++服务器设计（一）：基于I/O复用的Reactor模式

    I/O模型选择 在网络服务端编程中,一个常见的情景是服务器需要判断多个已连接套接字是否可读,如果某个套接字可读,则读取该套接字数据,并进行进一步处理. 在最常用的阻塞式I/O模型中,我们对每个连接套接 ...

  4. stl学习之模板

    模板是实现代码重用机制的一种工具,实质就是实现类型参数化,即把类型定义为参数. C++提供两种模板:函数模板,类模板.   template<typename T> //或者 templa ...

  5. [翻译] C++ STL容器参考手册（第二章 <deque>）

    返回总册 本章节原文:http://www.cplusplus.com/reference/deque/deque/ 1. std::deque template < class T, clas ...

  6. python中json的操作示例

    先上一段示例 # -*- coding: cp936 -*- import json #构造一个示例数据,并打印成易读样式 j = {} j["userName"]="a ...

  7. windows平台使用Microsoft Visual C++ Compiler for Python 2.7编译python扩展

    在windows平台上安装python c extension的扩展包是件很痛苦的事情,一般通过安装vc/vs系列来编译C扩展,不过安装包都比较大.或者通过mingw编译,不过有时会在兼容性上出现点问 ...

  8. Oracle 向上递归、向下递归

    ---- 向上递归select distinct orgguid,dtb_orgguid,orgname from dtba_organization a start with orgguid = ' ...

  9. Maven的使用--Eclipse在线安装Maven插件m2e

    我使用的Eclipse版本是3.7(Indigo) 通过Eclipse的help选项,点击“Install New Software...”弹出安装对话框, 点击add按钮,在Location里输入h ...

  10. try-catch-finally块的运行机制

    try {}里有一个return语句,那么紧跟在这个try后的finally {}里的code会不会被执行,什么时候被执行,在return前还是后? 也许你的答案是在return之前,但往更细地说,我 ...