javascript实现点击后变换按钮显示文字的方法

　　本文实例讲述了javascript实现点击后变换按钮显示文字的方法。分享给大家供大家参考。具体实现方法如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>显示一些按钮，如果点击了，
当前点击的按钮文本变为“点了”，其他按钮文本变为“没点”</title>
<script type="text/javascript">
//为所有按钮动态添加事件
function IniButtonEvent() {
var Items = document.getElementsByTagName("input");
for (var i = 0; i < Items.length; i++) {
var objTmp = Items[i];
if (objTmp.type == "button") {
objTmp.onclick = ButtonClick;
}
}
}
function ButtonClick() {
var Items = document.getElementsByTagName("input");
for (var i = 0; i < Items.length; i++) {
var objTmp = Items[i];
if (objTmp.type == "button") {
//判断是否是按钮
//window.event.srcElement触发当前事件的元素
//用来判断是否是当前单击的按钮
if (objTmp == window.event.srcElement) {
objTmp.value = "点了";
}
else {
objTmp.value = "没点";
}
}
}
}
</script>
</head>
<body onload="IniButtonEvent()">
显示一些按钮，如果点击了，当前点击的按钮文本变为“点了”，
其他按钮文本变为“没点”<br />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
</body>
</html>

　　希望本文所述对大家的javascript程序设计有所帮助。

时间： 2024-11-30 10:33:13

javascript实现点击后变换按钮显示文字的方法

javascript实现点击后变换按钮显示文字的方法的相关文章

javascript实现点击后变换按钮显示文字的方法_javascript技巧

JavaScript实现定时隐藏与显示图片的方法_javascript技巧

JavaScript实现在标题栏上显示当前日期的方法

JavaScript获取页面上被选中文字的方法技巧

JavaScript实现在标题栏上显示当前日期的方法_javascript技巧

JavaScript获取页面上被选中文字的方法技巧_javascript技巧

Win7任务栏缩略图改为显示文字提示方法

Win7任务栏缩略图不显示文字怎么办

JS/jQuery实现默认显示部分文字点击按钮显示全部内容_javascript技巧