背景:比如存在学生选择的CheckBox,希望在CheckBox中同时存储学生的姓名及其所在的城市,比如选择Lily所对应的CheckBox以后,可以获得Lily所在的城市“NewYork”。

html代码如下:

<input type="checkbox" id=@s.ID class="stuCheck" value=@s.Name itemid=@s.City onclick="whenStuChecked($(this))"/>

如上代码,s是一个Stu对象,由ID、Name、City和Age四个字段组成,在html代码中,由value来存储学生的姓名,itemid来存储学生所在的城市。

JS代码如下:

    function updateCheckedStus() {
checkedStus = "";
$("#tableStu").find("input.stuCheck").each(function () {
if ($(this).attr("checked") == "checked") {
checkedStus += $(this).attr("itemid") + " ";
}
});
$("#checkedStu").text(checkedStus);
}

如上代码,判断table中的每一个checkbox元素,如果被选中,更新checkedStus变量,显示在$("#checkedStu")元素中。

总结:itemid和其他html属性的赋值和取值的用法一致,在这里单独拿出来讲,是因为可以将该功能集成到如何根据集合动态构建复选框选择控件中。

注意:实际上,可以自定义特性来存储元素信息,特性名称自拟,如下代码:

     <button id="btn1" _mystyle="zidingyi">点击</button>

_mystyle是自定义的特性,不属于button元素,任然可以获取到btn1的_mystyle特性值,代码如下:

             alert($("#btn1").attr('_mystyle'));

但是编译器会报告一个警告,如图:

在html借助元素特性存储信息的更多相关文章

  1. 区分元素特性attribute和对象属性property

    × 目录 [1]定义 [2]共有 [3]例外[4]特殊[5]自定义[6]混淆[7]总结 前面的话 其实attribute和property两个单词,翻译出来都是属性,但是<javascript高 ...

  2. js中迭代元素特性与DOM中的DocumentFragment类型 笔记

    JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他 ...

  3. MVC中得到成员元数据的Description特性描述信息公用方法

    #region 从类型成员获取指定的Attribute T特性集合 /// <summary> /// 从类型成员获取指定的Attribute T特性集合 /// </summary ...

  4. 利用反射来实现获取成员的指定特性(Attribute)信息

    在开发过程中,我们经常需要自定义一些特性,来辅助我们完成对对象或者枚举进行管理.我们需要知道如何获取对象使用的特性信息. 以下举个学习用的例子. 我们自定义一个特性类,这个特性设置在一个数据段内是否执 ...

  5. 学习总结:CSS(二)块级与行级元素特性、盒模型、层模型、BUG与BFC、浮动模型

    一.元素的块级与行级特性 在CSS属性display控制元素是否及如何显示的特性,常用的值有none.inline.block.inline-block,在CSS3中还有一些新的特性状态,在这里不做讨 ...

  6. 获取或操作DOM元素特性的几种方式

    1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...

  7. jquery在元素中存储数据:data()

    转自:http://www.php.cn/js-tutorial-405445.html 在元素中存储数据:data() 1 2 3 4 5 6 7 8 9 10 <!DOCTYPE html& ...

  8. Ionic之存储信息、取出存储信息、注销存储信息

    每一个app软件在登录的时候,都会本地存储登录信息,需要用到数据的时候,就直接在本地获取,而不是每一次应用的时候都要请求到服务器来验证登录信息,减少服务器的负担.所以在设计混合HTML5 移动应用程序 ...

  9. System.IO.IsolatedStorage 使用 IsolatedStorageFileStream 存储信息

    在C#中还有一种叫做IsolatedStorage的存储机制,他存储信息的方式类似于我们的cookie, IsolatedStorage存储独立于每一个application,换句话说我们加载多个应用 ...

随机推荐

  1. 创建表规范 lob 字段

    ORAClce 11g 提供如下特性: BasicfileOracle10g 及之前版本被称为basicfile Securefile11g中新增securefile 优点:集中写入缓存(WGC),4 ...

  2. 当css样式表遇到层2

    9.定制层的display属性:层的表现是通过框这种结构来实现的.框可以是块级对象也可以是行内对象. Display属性就是用来控制其中内容是块级还是行级.定义为block则为kuai块级,inlin ...

  3. B. Connecting Universities DFS,无向树

    http://codeforces.com/problemset/problem/700/B 题意是,在一颗树中,有k个大学,要求两两匹配,他们之间的距离作为贡献,使得距离总和最大. 一开始的时候无从 ...

  4. solrJ的查询->统计【转】

    package com.fjsh.SearchJobsFirst; import java.text.SimpleDateFormat; import java.util.Calendar; impo ...

  5. mvc报( 检测到有潜在危险的 request.form 值 )错的解决方案

    今天在做项目中遇到了报( 检测到有潜在危险的 request.form 值 )错,百度过后解决了该问题,出此问题主要还是因为提交的Form中有HTML字符串,例如你在TextBox中输入了html标签 ...

  6. JVM内存各个区域分工简单介绍

    JVM内存各个区域简单介绍: 程序计数器:程序计数器是一块较小的内存空间,它可以看作是当前线程所执行的字节码的行号指示器. 在使用多线程时,为了线程切换后能恢复到正确的执行位置,每条线程都需要有个独立 ...

  7. CF962D Merge Equals

    思路: 不必每次都找最小的值进行合并,从前往后扫一遍的过程中能合并就一直合并. 实现: #include <bits/stdc++.h> using namespace std; type ...

  8. CSS进阶:提高你前端水平的 4 个技巧

    译者注:随着 Node.js .react-native 等技术的不断出现,和互联网行业的创业的层出不穷,了解些前端知识,成为全栈攻城师,快速的产出原型,展示你的创意,对程序员,尤其是在创业的程序员来 ...

  9. 801硬件检测工具DragonHD的使用

    801硬件检测工具DragonHD的使用 2018/11/28 13:39 版本:V1.0 开发板:SC3817R 1.客户要认证器件,使用了全志官方的工具:DragonHD.exe 打开之后可以见用 ...

  10. 关于maven source1.5报错

    是因为maven 默认是1.5编译的 <build>//加上这个配置,把编译给改掉试试 <pluginManagement> <plugins> <plugi ...