87,910
社区成员
发帖
与我相关
我的任务
分享js控制2个form下相同DIV的显示、隐藏
一个页面有两个from，现在要通过点击，显示不同form下的Div(开始div隐藏，div的name、id都相同)
<script>
function test1(){
document.form1.1.style="block";
}
function test2(){
document.form2.1.style="block";
}
</script>
<form name="form1" id="form1">
<table>
<tr>
<td>
<div name="1" id="1" style="display:none">xxxxx</div>
</td>
</tr>
<tr>
<td>
<input type="button" value="test" onclick="test1()">
</td>
</tr>
</table>
</form>
<form name="form2" id="form2">
<table>
<tr>
<td>
<div name="1" id="1" style="display:none">yyyyy</div>
</td>
</tr>
<tr>
<td>
<input type="button" value="test" onclick="test2()">
</td>
</tr>
</table>
</form>
...全文
请发表友善的回复…
发表回复
jamm1986 2010-01-18
- 打赏
- 举报
不是form表单元素，最好还是别用name的好
licip 2010-01-18
- 打赏
- 举报
命名最好规范一点，要不然，会有很多的问题会产生的。
sundotLei 2010-01-18
- 打赏
- 举报
[Quote=引用 11 楼 shdxiang 的回复:]
JScript codefunction test2(){var t="888880101035700";var obj=document.form2.getElementsByTagName("div");
alert("1");var len=obj.length;
alert("obj.length===="+obj.length);for(i=0;i<len;i++){
alert("obj[i].name==="+obj[i].name);if(obj[i].name==t){
alert("2");
alert(document.form2.getElementsByTagName("div")[i].name);
obj[i].style.display='block';
}else{
alert("不存在");
}
}
}
为何这句obj[i].name在火狐下无效啊
[/Quote]
obj[i].name 换为
obj[i].getAttribute("name")
JScript codefunction test2(){var t="888880101035700";var obj=document.form2.getElementsByTagName("div");
alert("1");var len=obj.length;
alert("obj.length===="+obj.length);for(i=0;i<len;i++){
alert("obj[i].name==="+obj[i].name);if(obj[i].name==t){
alert("2");
alert(document.form2.getElementsByTagName("div")[i].name);
obj[i].style.display='block';
}else{
alert("不存在");
}
}
}
为何这句obj[i].name在火狐下无效啊
[/Quote]
obj[i].name 换为
obj[i].getAttribute("name")
shdxiang 2010-01-18
- 打赏
- 举报
function test2(){
var t ="888880101035700";
var obj=document.form2.getElementsByTagName("div");
alert("1");
var len=obj.length;
alert("obj.length===="+obj.length);
for(i=0;i<len;i++){
alert("obj[i].name==="+obj[i].name);
if(obj[i].name==t){
alert("2");
alert(document.form2.getElementsByTagName("div")[i].name);
obj[i].style.display='block';
}else{
alert("不存在");
}
}
}
为何这句obj[i].name在火狐下无效啊
shdxiang 2010-01-18
- 打赏
- 举报
function test2(){
var obj=document.form2.getElementsByTagName("div");
var len=obj.length;
for(i=0;i<len;i++){
if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}
为什么这段脚本 火狐不支持啊
sundotLei 2010-01-14
- 打赏
- 举报
<script>
function test1(){
document.form1.getElementsByTagName("div")[0].style.display="block";
}
function test2(){
document.form2.getElementsByTagName("div")[0].style.display="block";
}
</script>
happy002 2010-01-14
- 打赏
- 举报
document.getElementsByName("1")[i].style.display="block"
happy002 2010-01-14
- 打赏
- 举报
id是不可以相同的！！
可以用name
for(var i=0;i<document.getElementsByName("1").length;i++){
document.getElementsByName("1")[i].value = ""
}
可以用name
for(var i=0;i<document.getElementsByName("1").length;i++){
document.getElementsByName("1")[i].value = ""
}
bing475879749 2010-01-14
- 打赏
- 举报
<form name="form1" id="form1">
<table>
<tr>
<td>
<div name="name1" id="name1" style="display:none">xxxxx</div>
</td>
</tr>
<tr>
<td>
<input type="button" value="test" onclick="test1()">
</td>
</tr>
</table>
</form>
<form name="form2" id="form2">
<table>
<tr>
<td>
<div name="name1" id="name1" style="display:none">yyyyy</div>
</td>
</tr>
<tr>
<td>
<input type="button" value="test" onclick="test2()">
</td>
</tr>
</table>
</form>
<script>
function test1(){
var obj=document.form1.getElementsByTagName("div");
var len=obj.length;
for(i=0;i<len;i++){
if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}
function test2(){
var obj=document.form2.getElementsByTagName("div");
var len=obj.length;
for(i=0;i<len;i++){
if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}
</script>不确定DIV位置的方法
千游 2010-01-14
- 打赏
- 举报
function test1(){
document.form1.name.style="block";
}
这个name 指的是属于form中的控件的name,比如<input name = "1"/>才可以用
你要取的div不属于form控件，所以加个id取好了
document.form1.name.style="block";
}
这个name 指的是属于form中的控件的name,比如<input name = "1"/>才可以用
你要取的div不属于form控件，所以加个id取好了
kksss 2010-01-14
- 打赏
- 举报
很傻的硬编码方式 54了ID只和DOM结构有关系
function test1(){
document.form1.children[0].getElementsByTagName('div')[0].style.display = 'block';
}
function test2(){
document.form2.children[0].getElementsByTagName('div')[0].style.display = 'block';
}
curacfyh 2010-01-14
- 打赏
- 举报
第二个表单的id改为‘2’吧。
命名不要用数字，姑且这么做喽。
“ document.form1.1.style”
不知道你这个是干什么。forms对象集合最好，W3C标准。
你这个是IE的，而且，数字做id也是不行的。
命名不要用数字，姑且这么做喽。
function test1(){
var oDiv = document.getElementById('1');
if(oDiv.style.display=='none') {
oDiv.style.display='block';
} else {
oDiv.style.display='none';
}
}
function test2(){
var oDiv = document.getElementById('2');
if(oDiv.style.display=='none') {
oDiv.style.display='block';
} else {
oDiv.style.display='none';
}
}
“ document.form1.1.style”
不知道你这个是干什么。forms对象集合最好，W3C标准。
你这个是IE的，而且，数字做id也是不行的。
loveunittesting 2010-01-14
- 打赏
- 举报
id好像不能用1,2这样的命名吧，可以改一下，如d1,d2都可以
shdxiang 2010-01-14
- 打赏
- 举报
[Quote=引用 5 楼 bing475879749 的回复:]
HTML code<formname="form1" id="form1"><table><tr><td><divname="name1" id="name1" style="display:none">xxxxx</div></td></tr><tr><td><inputtype="button" value="test" onclick="test1()"></td></tr></table></form><formname="form2" id="form2"><table><tr><td><divname="name1" id="name1" style="display:none">yyyyy</div></td></tr><tr><td><inputtype="button" value="test" onclick="test2()"></td></tr></table></form><script>function test1(){var obj=document.form1.getElementsByTagName("div");var len=obj.length;for(i=0;i<len;i++){if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}function test2(){var obj=document.form2.getElementsByTagName("div");var len=obj.length;for(i=0;i<len;i++){if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}</script>
不确定DIV位置的方法
[/Quote]
单独试了你的可以，我自己写的就是不行啊
HTML code<formname="form1" id="form1"><table><tr><td><divname="name1" id="name1" style="display:none">xxxxx</div></td></tr><tr><td><inputtype="button" value="test" onclick="test1()"></td></tr></table></form><formname="form2" id="form2"><table><tr><td><divname="name1" id="name1" style="display:none">yyyyy</div></td></tr><tr><td><inputtype="button" value="test" onclick="test2()"></td></tr></table></form><script>function test1(){var obj=document.form1.getElementsByTagName("div");var len=obj.length;for(i=0;i<len;i++){if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}function test2(){var obj=document.form2.getElementsByTagName("div");var len=obj.length;for(i=0;i<len;i++){if(obj[i].name=="name1"){
obj[i].style.display="block";
}
}
}</script>
不确定DIV位置的方法
[/Quote]
单独试了你的可以，我自己写的就是不行啊
<html>
<head>
<title>123.html</title>
<script>
function test1(){
var obj=document.form2.getElementsByTagName("div");
var len=obj.length;
alert(len);
for(i=0;i<len;i++){
if(obj[i].name=="888880101035700"){
alert(obj[i].name);
obj[i].style.display="block";
}
}
}
</script>
</head>
<body>
<form action="" method="POST" name="form2" id="form2">
<TABLE cellSpacing=0 cellPadding=2 width="100%" border=0>
<TBODY>
<TR>
<TD class=td_leftItem width="26%">
<input type="radio" name="payOrgId_s" value="888880101045700" />
123
</TD>
</TR>
<TR>
<TD class=td_leftItem width="26%">
<div name="888880101035700" id="888880101035700" style="display:none">
<input type="radio" name="payOrgId_s" value="888880101035700" checked="checked" />
456
</div>
</TD>
</TR>
<TR>
<TD class=td_leftItem width="26%">
<input type="radio" name="payOrgId_s" value="888880101055700" />
789
</TD>
</TR>
<tr>
<TD>
<input type="submit" value="确认无误，提交" onclick="test1();" />
</TD>
</TR>
</TBODY>
</TABLE>
</from>
<script type="text/javascript"></script>
</body>
</html>
