在html借助元素特性存储信息
背景:比如存在学生选择的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借助元素特性存储信息的更多相关文章
- 区分元素特性attribute和对象属性property
× 目录 [1]定义 [2]共有 [3]例外[4]特殊[5]自定义[6]混淆[7]总结 前面的话 其实attribute和property两个单词,翻译出来都是属性,但是<javascript高 ...
- js中迭代元素特性与DOM中的DocumentFragment类型 笔记
JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他 ...
- MVC中得到成员元数据的Description特性描述信息公用方法
#region 从类型成员获取指定的Attribute T特性集合 /// <summary> /// 从类型成员获取指定的Attribute T特性集合 /// </summary ...
- 利用反射来实现获取成员的指定特性(Attribute)信息
在开发过程中,我们经常需要自定义一些特性,来辅助我们完成对对象或者枚举进行管理.我们需要知道如何获取对象使用的特性信息. 以下举个学习用的例子. 我们自定义一个特性类,这个特性设置在一个数据段内是否执 ...
- 学习总结:CSS(二)块级与行级元素特性、盒模型、层模型、BUG与BFC、浮动模型
一.元素的块级与行级特性 在CSS属性display控制元素是否及如何显示的特性,常用的值有none.inline.block.inline-block,在CSS3中还有一些新的特性状态,在这里不做讨 ...
- 获取或操作DOM元素特性的几种方式
1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...
- jquery在元素中存储数据:data()
转自:http://www.php.cn/js-tutorial-405445.html 在元素中存储数据:data() 1 2 3 4 5 6 7 8 9 10 <!DOCTYPE html& ...
- Ionic之存储信息、取出存储信息、注销存储信息
每一个app软件在登录的时候,都会本地存储登录信息,需要用到数据的时候,就直接在本地获取,而不是每一次应用的时候都要请求到服务器来验证登录信息,减少服务器的负担.所以在设计混合HTML5 移动应用程序 ...
- System.IO.IsolatedStorage 使用 IsolatedStorageFileStream 存储信息
在C#中还有一种叫做IsolatedStorage的存储机制,他存储信息的方式类似于我们的cookie, IsolatedStorage存储独立于每一个application,换句话说我们加载多个应用 ...
随机推荐
- Python递归和迭代
递归 在函数内部,调用函数自身的编程技巧称为递归( recursion).递归函数结构清晰,很直观的理解计算过程,但也有严重缺点:相对于普通循环而言,递归运行效率较低,经过很多冗余的计算,递归会消耗大 ...
- JavaScript--数组常用方法总结
JavaScript--数组常用方法总结 测试模板: var arr = ["a", "b", "c", "d", &q ...
- eclipse 当安装jad仍然不能反编译,提示attach source的时候
当安装jad仍然不能反编译,提示attach source的时候,其实是当前workspace有问题了: 所使用的workspace目录下.metadata\.mylyn会出现一个.tasks.xml ...
- 127 Word Ladder 单词接龙
给出两个单词(beginWord 和 endWord)和一个字典,找到从 beginWord 到 endWord 的最短转换序列,转换需遵循如下规则: 每次只能改变一个字母. 变换过程中的 ...
- 152 Maximum Product Subarray 乘积最大子序列
找出一个序列中乘积最大的连续子序列(该序列至少包含一个数).例如, 给定序列 [2,3,-2,4],其中乘积最大的子序列为 [2,3] 其乘积为 6.详见:https://leetcode.com/p ...
- rhel 6.5--samba
配置匿名共享: 服务端: [root@master ~]# yum install -y samba 或者 [root@master ~]# yum groupinstall -y "CIF ...
- P1979 华容道 spfa题解
题目描述 [问题描述] 小 B 最近迷上了华容道,可是他总是要花很长的时间才能完成一次.于是,他想到用编程来完成华容道:给定一种局面, 华容道是否根本就无法完成,如果能完成, 最少需要多少时间. 小 ...
- android开发学习 ------- 枚举类型在Android中的用法
一般上为了简化代码,重用代码,设置标志位来表示不同的流程,这个标志位可以使用枚举类型来表示: 1:定义 public FbManner fbManer = FbManner.EMAIL; //给一个默 ...
- LN : leetcode 494 Target Sum
lc 494 Target Sum 494 Target Sum You are given a list of non-negative integers, a1, a2, ..., an, and ...
- SQL Server 2008还原数据库的具体方法
俗话说“好记性不如烂笔头”,在相隔较长的时间段内,每次还原客户的数据库都记不清完全的步骤,为此mark一下. SQL Server 2008一般默认备份的文件格式是bak,即后缀名为.bak.bak文 ...