用javascript添加控件自定义属性
来源:互联网 发布:软件功能模块接口列表 编辑:程序博客网 时间:2024/06/03 14:25
1.为HTML元素添加一自定义的属性非常方便,只须将其加到尖括号中即可,与内置属性地位相等。
如我们要为TextBox元素添加属性idvalue:
idvalue即可正式成为txtInput的属性,地位与其他属性相等。
如以下例子,在IE6中调试通过:
<html>
<head>
<title>自定义属性</title>
<script language="javascript">
function showText()
{
alert(document.getElementById("txtInput").value);
}
function showValue()
{
alert(document.getElementById("txtInput").idvalue);
}
</script>
</head>
<body>
<input type="text" id="txtInput" name="txtInput" value="自定义文本" idvalue="自定义值">
<input type="button" id="btnShowText" name="btnShowText" value="显示文本内容" onclick="showText();">
<input type="button" id="btnShowValue" name="btnShowValue" value="显示文本值" onclick="showValue();">
</body>
</html>
但idvalue在Firefox中却不能通过,主要是因为Firefox控制严格,所以这些自定义属性不能认识。经过调试,只能用document.getElementById("txtInput").attributes["idvalue"].nodeValue取得,该方法在IE中也可使用。所以,同时适用IE和Firefox的代码为:
<html>
<head>
<title>自定义属性</title>
<script language="javascript">
function showText()
{
alert(document.getElementById("txtInput").value);
}
function showValue()
{
alert(document.getElementById("txtInput").attributes["idvalue"].nodeValue);
}
</script>
</head>
<body>
<input type="text" id="txtInput" name="txtInput" value="自定义文本" idvalue="自定义值">
<input type="button" id="btnShowText" name="btnShowText" value="显示文本内容" onclick="showText();">
<input type="button" id="btnShowValue" name="btnShowValue" value="显示文本值" onclick="showValue();">
</body>
</html>
2.js赋值
前面说过为HTML元素添加自定义的属性,是通过手动在HTML控件中加上,其实可以在javascript中动态添加:如有一文本框:
如想增加idvalue属性(值为”自定义值”),可以在javascript中这样写:
txt.setAttribute("idvalue","自定义值");
setAttribute中第一个参数是指明自定义属性的名称,第二个参数是初始值
代码如下:
<html>
<head>
<title>用javascript添加控件自定义属性</title>
<script language="javascript">
function addCustomAttribute()
{
var txt = document.getElementById("txtInput");
txt.setAttribute("idvalue","自定义值");
}
function showIdValue()
{
var txt = document.getElementById("txtInput");
alert(txt.attributes["idvalue"].nodeValue);
}
</script>
</head>
<body onload="addCustomAttribute();">
<input type="text" id="txtInput" name="txtInput" value="自定义文本">
<input type="button" value="显示idValue" onclick="showIdValue();">
</body>
</html>
- 用javascript添加控件自定义属性
- 用javascript添加控件自定义属性
- 用javascript添加控件自定义属性
- Android自定义控件添加属性
- 为自定义控件添加属性
- Android给自定义控件添加自定义属性
- 为自定义控件添加"自定义属性"
- 为android自定义控件添加自定义属性
- 如何给自定义控件添加自定义属性
- 自定义控件添加上自定义的控件属性。
- 给用户自定义控件添加属性
- 自定义控件Checkbox添加ReadOnly 属性
- Delphi 给自定义控件添加属性页
- Android 自定义控件☞添加attr属性
- 为控件添加自定义附加属性
- 3.为自定义控件添加属性
- android 重写控件添加自定义属性
- Qt 5.8下自定义控件属性栏属性自我添加
- ios模拟器中设置经纬度
- varnish初探(2)
- 多张图片合成连续动画实现(IOS)
- apt-get的更新源
- C++ 类型转换 (static_cast dynamic_cast reinterpret_cast const_cast typeid)
- 用javascript添加控件自定义属性
- 使用impress.js模板制作的HTML5网页幻灯片
- iOS-实现文件上传下载
- IOS网络检测及使用
- 清理脚本滑动窗口方式清理日志文件
- 二维码libzbar设置扫描区域
- 关于 -- IPhone 的音频队列服务
- Keil C51对C语言的关键词扩展之五: code
- <转>MFC 消息机制