1.jquery取复选框的值

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

 <!--引入jquery包-->

 <script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的-->

 <style type="text/css">

 </style>

 </head>

 <body>

 <input type="checkbox" value="01" class="ck" />

 <input type="checkbox" value="02" class="ck" />

 <input type="checkbox" value="03" class="ck" />

 <input type="checkbox" value="04" class="ck" />

 <input type="checkbox" value="05" class="ck" />

 <input type="button" value="取选中" id="btn" />

 <script type="text/jscript">

 //取复选框的选中值

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

         var ck = $(".ck");

         for(var i=0;i<ck.length;i++)

         {

             //判断选中

             /*if(ck[i].checked)

             {

                 alert(ck[i].value);//js方法

             }*/

             if(ck.eq(i).prop("checked"))//prop判断是否选中

             {

                 alert(ck.eq(i).val());

             }

         }

     })

 </script>

 </body>

 </html>

2.取下拉列表里面的属性值

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

 <!--引入jquery包-->

 <script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的-->

 <style type="text/css">

 </style>

 </head>

 <body>

 <select id="sel">

     <option value="1111">1111</option>

     <option value="2222">2222</option>

     <option value="3333">3333</option>

 </select>

 <input type="button" value="取下拉" id="b1" />

 <script type="text/jscript">

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

             alert($("#sel").val());

         })

 </script>

 </body>

 </html>

3.取单选钮的属性值

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

 <!--引入jquery包-->

 <script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的-->

 <style type="text/css">

 </style>

 </head>

 <body>

 <input class="ck" type="radio" value="01" class="rd" name="a" />

 <input class="ck" type="radio" value="02" class="rd" name="a" />

 <input class="ck" type="radio" value="03" class="rd" name="a" />

 <input class="ck" type="radio" value="04" class="rd" name="a" />

 <input class="ck" type="radio" value="05" class="rd" name="a" />

 <input type="button" value="取单选" id="b2" />

 <script type="text/jscript">

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

     var ck = $(".ck");

         for(var i=0;i<ck.length;i++)

         {

             if(ck.eq(i).prop("checked"))//prop判断是否选中

             {

                 alert(ck.eq(i).val());

             }

         }

     })

 </script>

 </body>

 </html>

4.jquery做全选按钮

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

 <!--引入jquery包-->

 <script src="../jquery-1.11.2.min.js"></script><!--引入的jquery一定是在最上面的-->

 <style type="text/css">

 </style>

 </head>

 <body>

 <input type="checkbox" id="qx" />全选

 <input type="checkbox" value="01" class="ck" />

 <input type="checkbox" value="02" class="ck" />

 <input type="checkbox" value="03" class="ck" />

 <input type="checkbox" value="04" class="ck" />

 <input type="checkbox" value="05" class="ck" />

 <script type="text/jscript">

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

         /*if($(this)[0].checked)

         {

             $(".ck").attr("checked","checked")

         }

         else

         {

             $(".ck").removeAttr("checked");

         }*///标记的这段代码中存在bug，不能用来做全选，要记住。用下面2行代码。

 　　　　　　var xz = $(this).prop("checked")//xz接收的值是true（选中）或者flase（未选中）

 　　　　　　$(".ck").prop("checked",xz)//如果是选中，就是true

         })

 </script>

 </body>

 </html>

5.js或jquery里面有数据存储方式

　　存储数据的名字叫做JSON

var json = {code:"n001",name:"张三",js:{c:"p001",n:"回族"}};//定义方式。定义比较随便，可以往里面放任意数据。

    //取值

    //alert(json.code)//取值方式

    //alert(json.js.n)

    //alert(json["name"])

6.去空格

 var str= "    hello ";

 str = str.trim();//不加取空格输出的长度是10，包含空格的长度。去掉空格输出的长度为5.

 alert(str.length)

Jquery取属性值（复选框、下拉列表、单选按钮）、做全选按钮、JSON存储、去空格的更多相关文章

  1. 11月8日下午Jquery取属性值（复选框、下拉列表、单选按钮）、做全选按钮、JSON存储、去空格

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  2. 11.8 开课二个月零四天 （Jquery取属性值，做全选，去空格）

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  3. 复选框（checkox）全选、全不选、反选、获得选中项值的用例

    HTML部分: <div class="all"> <ul> <li><input type="checkbox" v ...

  4. jQuery对复选框（checkbox)的全选，全不选，反选等的操作

    效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...

  5. jQuery实现checkbox（复选框）选中、全选反选代码

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  6. 复选框回显、全选、非全选、cookie处理数据、json数组对象转换处理学习笔记参考的页面

    <%@include file="/common/head.jsp"%> <%@ page contentType="text/html; charse ...

  7. Android开发CheckBox控件，全选，反选，取消全选

    在Android开发中我们经常会使用CheckBox控件,那么怎么实现CheckBox控件的全选,反选呢 首先布局我们的界面: <?xml version="1.0" enc ...

  8. CheckedListBoxControl 实现复选框的单选与多选功能

    由于工作需要,需要实现复选框的单选与多选功能,找了好多资料都不是很全,经过两天苦苦的挖挖挖,终于完成啦O(∩_∩)O哈哈~ 用DEV控件中的CheckedListBoxControl控件,当然VS中的 ...

  9. bootstrap历练实例：复选框或单选按钮作为输入框组的前缀或后缀

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

随机推荐

  1. 安装php提示 configure: error: Cannot find OpenSSL's libraries 解决方案

    一次在安装php7其中提示错误信息 configure: error: Cannot find OpenSSL's libraries 出现这种有2中情况,一种是没有安装 openssl,另一种是安装 ...

  2. JS模式--通用对象池的实现

    var objectPoolFactory = function (createObjFn) { var objectPool = []; return { create: function () { ...

  3. get和post提交数据的区别

    get是客户端向服务器索取数据的请求,设定的初衷是,客户端(浏览器)给服务器发送请求,然后服务器再返回给客户端其要求的数据. 那么为什么说get也能提交数据呢? 我们仔细理解第一句话“客户端(浏览器) ...

  4. 前端框架对比之vue与regular(一)

    每次一写到Regular总是忍不住先介绍一下,Regualr是网易杭州研究所的一位叫郑海波的大神写的一款前端框架,目前 这款框架推广的不深,加上其和angular过于相似的框架名,导致接受力并不大,其 ...

  5. [js笔记整理]正则篇

    一.正则基本概念 1.一种规则.模式 2.强大的字符串匹配工具 3.在js中常与字符串函数配合使用 二.js正则写法 正则在js中以正则对象存在: (1)var re=new RegExp(正则表达式 ...

  6. eclipse简介及下载

    一.Eclipse 是非常着名的跨平台的自由集成开发环境(IDE).最初主要用来Java语言开发,但是目前亦有人通过插件使其作为其他计算机语言比如C++和Python的开发工具. 二.Eclipse的 ...

  7. ASP.NET Core 使用 JWT 搭建分布式无状态身份验证系统

    为什么使用 Jwt 最近,移动开发的劲头越来越足,学校搞的各种比赛都需要用手机 APP 来撑场面,所以,作为写后端的,很有必要改进一下以往的基于 Session 的身份认证方式了,理由如下: 移动端经 ...

  8. NancyFx 2.0的开源框架的使用-Stateless

    同样和前面一样新建一个空的Web项目,都在根目录添加Module,Models,Views文件夹 添加Nuget包 在Models文件夹里面添加UserModel类 public string Use ...

  9. 微信小程序，前端大梦想（七）

    微信小程序之数据缓存实例-备忘录 数据缓存在移动端的使用是非常重要的,既可以减少用户的流量支出又可以提高程序的访问速度和用户体验.每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStora ...

  10. python 之变量

    什么是变量? 变量就是存储一个不固定的值,可以随时更改其值. 1.变量不仅可以是数字,还可以是任意数据类型 2.变量名必须是大小写英文.数字和_的组合,且不能用数字开头 python变量如何存储 首先 ...