多个相同ID的DIV,怎么进行操作?

lokiice 2008-09-05 03:45:05
<table style="width:430px;height:330px;"  border="0" cellpadding="0" cellspacing="0" align="center">
<tr id="TitleStyleRead">
<td width="19" id="TitleStyleRead"></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">AAA</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">BBB</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">CCC</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">DDD</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">EEE</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">FFF</div> </td>
<td width="60" id="TitleStyleRead"><div id="ColumnsTitle">GGG</div></td>
<td> </td>
</tr>
<tr style="height:300px;">
<td colspan="9">"</td>
</tr>
</table>


当我onclick 的时候,怎么让他执行相似但不同的操作,就是执行的代码相同,但是代码中调用的函数是不选用的参数,比如,我点显示AAA的DIV,下面的函数中,show的aa参数就变成'X',点BBB的DIV,aa就变成'Y'

function onclick ()
{
show(aa)
}
...全文
849 23 打赏 收藏 转发到动态 举报
写回复
用AI写文章
23 条回复
切换为时间正序
请发表友善的回复…
发表回复
Tommy_gc 2008-09-08
  • 打赏
  • 举报
回复
[Quote=引用 2 楼 changke18 的回复:]
id是不可以相同,是唯一的
name可以相同
[/Quote]
Go 旅城通票 2008-09-08
  • 打赏
  • 举报
回复
<table style="width:430px;height:330px;"  border="0" cellpadding="0" cellspacing="0" align="center">
<tr id="TitleStyleRead">
<td width="19" id="TitleStyleRead"></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">AAA</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">BBB</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">CCC</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">DDD</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">EEE</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">FFF</div> </td>
<td width="60" id="TitleStyleRead"><div id="ColumnsTitle">GGG</div></td>
<td> </td>
</tr>
<tr style="height:300px;">
<td colspan="9">"</td>
</tr>
</table>
<script>
document.onclick=function(e){
e=e||event;
var obj=e.srcElement||e.target;
if(obj.id=="ColumnsTitle"){
var p=obj.innerHTML;
/*
//如果要传递对应的参数,这个参考对照下修改
switch(obj.innerHTML){
case "AAA":p="X";break;
case "BBB":p="Y";break;
//...其他的对应
}
*/
show(p);
}
}
function show(aa)
{
alert("你点击的div的内容为\t"+aa+"\n如果需要,你可以在上面的代码中更改传入函数的参数值");
}
</script>
lokiice 2008-09-08
  • 打赏
  • 举报
回复
我当然知道ID是唯一的,
我有在写XML的,ID有2个一样的就会出错
不过HTML了ID相同又不会出错,调用CSS样式又很方便,我又不是傻的,知道有错还用
传递字符串是没规律的,
b246347b 2008-09-07
  • 打赏
  • 举报
回复
[Quote=引用 14 楼 stefenjun 的回复:]
getElementByTagName();
得到数组
[/Quote]

可以用相同的class类,
zhjb1 2008-09-06
  • 打赏
  • 举报
回复
是可以实现的,在表单读取中采用数组的方式,而后按照顺序读取是可以的,从编程角度讲不合理,但从解决问题看是可行的。
要玩计算机,不要让计算机玩了。
zhihuixiaole 2008-09-06
  • 打赏
  • 举报
回复
哎,我就不多说了
mooring 2008-09-06
  • 打赏
  • 举报
回复
[Quote=引用 14 楼 stefenjun 的回复:]
getElementByTagName();
得到数组

[/Quote]
是一个数组,拼写应该是getElementsByTagName(),少了一个 s
路人乙e 2008-09-06
  • 打赏
  • 举报
回复
var divs = document.getElementById("tdContent").getElementsByTagName("div");
路人乙e 2008-09-06
  • 打赏
  • 举报
回复
[Quote=引用 3 楼 dh20156 的回复:]
不符合规则的写法,id只能是唯一的!
[/Quote]
stefenjun 2008-09-06
  • 打赏
  • 举报
回复
getElementByTagName();
得到数组
mooring 2008-09-06
  • 打赏
  • 举报
回复
其它没变,就是把div的id当成一个属性就可以了.
这个if(d[i].id = "ColumnsTitle") d[i].onclick = showme;
就应该把=写成 ==的
即 if(d[i].id == "ColumnsTitle") d[i].onclick = showme
mooring 2008-09-06
  • 打赏
  • 举报
回复
<!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>
<title>hello</title>
<meta http-equiv="Content-Type" Content="text/html;charset=utf-8" />
<script type="text/javascript">
window.onload = function()
{
var d = document.getElementsByTagName("div");
for(var i=0;i<d.length;i++)
{
if(d[i].id = "ColumnsTitle") d[i].onclick = showme;
}
}
function showme()
{
var tmp = this.innerHTML;
alert(tmp);
}
</script>
</head>
<body>
<div class="fixed">测试一下效果</div>
<table style="width:430px;height:330px;" border="0" cellpadding="0" cellspacing="0" align="center">
<tr id="TitleStyleRead">
<td width="19" id="TitleStyleRead"></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">AAA</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">BBB</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">CCC</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">DDD</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">EEE</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">FFF</div> </td>
<td width="60" id="TitleStyleRead"><div id="ColumnsTitle">GGG</div></td>
<td> </td>
</tr>
<tr style="height:300px;">
<td colspan="9">"</td>
</tr>
</table>


</body>
</html>
JoeBlackzqq 2008-09-05
  • 打赏
  • 举报
回复
就是,ID在一个页面中只能是唯一的,长见识了吧?呵呵
sebatinsky 2008-09-05
  • 打赏
  • 举报
回复
.............楼主,哈哈,看吧,大家都知道id只能唯一,你非要弄这么多,如果你到其他地方要去取这个id号,那得怎么操作啊,,
jackyBody 2008-09-05
  • 打赏
  • 举报
回复
要传递的字符串有什么规律没~~~

<div onclick="show()">11111111111111</div>
<div onclick="show()">33333333333</div>
<div onclick="show()">2222222222</div>
<div onclick="show()">55555555555555</div>
<div onclick="show()">7777777777777</div>
<script type="text/javascript">
function show()
{
str = event.srcElement;
alert(str.innerHTML)
}
</script>
CODE163 2008-09-05
  • 打赏
  • 举报
回复
找麻烦~~ID唯一
蹭分··
iori_wen 2008-09-05
  • 打赏
  • 举报
回复
<table style="width:430px;height:330px;"  border="0" cellpadding="0" cellspacing="0" align="center">
<tr id="TitleStyleRead">
<td width="19" id="TitleStyleRead"></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle" onclick="show(this)">AAA</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle" onclick="show(this)">BBB</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle" onclick="show(this)">CCC</div> </td>
<td> </td>
</tr>
<tr style="height:300px;">
<td colspan="9">"</td>
</tr>
</table>
<script>
function show(obj){
switch(obj.innerHTML){
case "AAA":
obj.innerHTML = "X";
break;
case "BBB":
obj.innerHTML = "Y";
break;
case "CCC":
obj.innerHTML = "Z";
break;
case "X":
obj.innerHTML = "AAA";
break;
case "Y":
obj.innerHTML = "BBB";
break;
case "Z":
obj.innerHTML = "CCC";
break;
default:
break;
}
}
</script>
  • 打赏
  • 举报
回复
代码是够差劲的
<script type="text/javascript">
window.onload=function(){
var oTd=document.getElementById("tdContent");
var aDivs=oTd.getElementsByTagName("div");
var i,nLen=aDivs.length;

for(i=0;i<nLen;i++){
aDivs[i].onclick=function(e){
var evt=e||window.event;
var srcEl=evt.target||evt.srcElement;
alert(srcEl.innerHTML);
}
}
}
</script>

<table style="width:430px;height:330px;" border="1" cellpadding="0" cellspacing="0" align="center">
<tr id="tdContent">
<td width="19" id="TitleStyleRead"></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">AAA</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">BBB</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">CCC</div> </td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">DDD</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">EEE</div></td>
<td width="40" id="TitleStyleRead"><div id="ColumnsTitle">FFF</div> </td>
<td width="60" id="TitleStyleRead"><div id="ColumnsTitle">GGG</div></td>
<td> </td>
</tr>
<tr style="height:300px;">
<td colspan="9">"</td>
</tr>
</table>

zzxap 2008-09-05
  • 打赏
  • 举报
回复
把id改为class
chuckcoin 2008-09-05
  • 打赏
  • 举报
回复
去捕获click这个event的srcElement试试


ps:写出这样代码的人,每个月拿的薪水是负数吧?
加载更多回复(3)

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧