<!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. gradient杂谈

    工作中难免遇到某些小项目中没有设计的情况,这对于PS基础薄弱的我来说非常恐怖.无奈之下,只好自己自学UI方面的知识,但对于某些能用CSS实现的背景样式等,还是尽可能地用已经掌握的知识去实现.本文主要分 ...

  2. CSS的优先级

    样式的优先级: (内联样式表[嵌入式样式])>(内部样式表)>(外部样式表) 经过测试动手测试发现有个(唯一的)例外 情况:当引用外部样式在内部样式表(非嵌入式样式)的后面时,外部样式会覆 ...

  3. python os模块文件相关

    使用前 import os导入模块   os模块: os.sep     可以取代操作系统特定的路径分割符 os.linesep  字符串给出当前平台使用的行终止符.例如,Windows使用'\r\n ...

  4. PagedList 分页

    @using PagedList.Mvc;@model PagedList.IPagedList<MvcApplicationBootStramp.Models.Person> @{    ...

  5. 解决iOS9苹果将原http协议改成了https协议问题

    解决方法: 在info.plist 加入key <key>NSAppTransportSecurity</key> <dict> <key>NSAllo ...

  6. 空合并操作符??(C#)

    ??二元操作符在对first??second求值时,大致会经历以下步骤: 1)对first进行求值: 2)如果结果非空,则该结果就是整个表达式的结果: 3)否则求second的值,其结果作为整个表达式 ...

  7. 生成树题目泛做（AD第二轮）

    题目1: NOI2014 魔法森林 LCT维护MST.解题报告见LOFTER #include <cstdio> #include <iostream> #include &l ...

  8. OpenCV——像素数据类型总结<摘>

    1.Unsigned 8bits(一般的图像文件格式使用的大小)IplImage数据结构参数:IPL_DEPTH_8UCvMat数据结构参数:CV_8UC1,CV_8UC2,CV_8UC3,CV_8U ...

  9. HTML5简单入门系列（三）

    前言 本篇介绍HTML5支持的Web存储(Web Storage)和HTML 5 应用程序缓存. 客户端存储数据介绍 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没 ...

  10. Measuring Lengths in Baden

    Description Measuring Lengths in Baden time limit per test: 2 seconds memory limit per test: 256 meg ...