如何在JS里显示不同的弹出div层,同时JS里有弹出层的方法?

问题是这样的,弹出层已经在JS里写好了,效果也有,可是我的页面有很多个div弹出层,要求点击页面中不同的文字时,弹出不同的div层,其他的div层隐藏,如何写方法,等。。。。。。。。。

  在以下方法里 
  function testMessageBox2(ev) 

{
var objPos = mousePosition(ev);
messContent="

要要
";
showMessageBox('要要',messContent,objPos,580,100);
}
  我想把div显示与隐藏用这个方法控制: 

function divshow1() 
{ 

    if(document.getElementById("divFunction22").style.display=="none") 
    { 

        document.getElementById("divFunction22").style.display="block"; 
      } 
    else 
    {    
        document.getElementById("divFunction22").style.display="none"; 
      } 
} 

页面如下:

麻烦各位高手,我实在是把这些方法合起来,有经验的帮帮?

写个方法??/
[b]问题补充:[/b]
我先试试呀,谢谢你的回答呀
[b]问题补充:[/b]

我的弹出层可能不止3个,有10几个呢?

那个IF ELSE不行吧?

还有个问题是,我的弹出层里也有DIV,如何把内容放进去呀
function testMessageBox2(ev)
{
var objPos = mousePosition(ev);
messContent="

要要
";
showMessageBox('要要',messContent,objPos,580,100);
}

一个DIV层有一个这个方法?

[b]问题补充:[/b]
这是弹出层JS脚本:全部定义的div

var isIe=(document.all)?true:false;
//设置select的可见状态
function setSelectState(state)
{
var objl=document.getElementsByTagName('select');
for(var i=0;i {
objl[i].style.visibility=state;
}
}
function mousePosition(ev)
{
if(ev.pageX || ev.pageY)
{
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
//弹出方法
function showMessageBox(wTitle,content,pos,wWidth)
{
closeWindow();
var bWidth=parseInt(document.documentElement.scrollWidth);
var bHeight=parseInt(document.documentElement.scrollHeight);
if(isIe){
setSelectState('hidden');}
var back=document.createElement("div");
back.id="back";
var styleStr="top:0px;left:0px;position:absolute;background:#666;width:"+bWidth+"px;height:"+bHeight+"px;";
styleStr+=(isIe)?"filter:alpha(opacity=0);":"opacity:0;";
back.style.cssText=styleStr;
document.body.appendChild(back);
showBackground(back,50);
var mesW=document.createElement("div");
mesW.id="mesWindow";
mesW.className="mesWindow"; /*控制弹出层TITLE的类*/
mesW.innerHTML="

<table width='100%' height='100%' style='background-

color:#ffffff;'>

"+wTitle+" <input type='button' onclick='closeWindow();' title='关闭窗口' class='close' value='关闭'

/>

"+content+"
";

styleStr="left:"+(((pos.x-wWidth)>0)?(pos.x-wWidth):pos.x)+"px;top:"+(pos.y)+"px;position:absolute;width:"+wWidth+"px;";
mesW.style.cssText=styleStr;
document.body.appendChild(mesW);
}
//让背景渐渐变暗
function showBackground(obj,endInt)
{
if(isIe)
{
obj.filters.alpha.opacity+=1;
if(obj.filters.alpha.opacity <endInt)
{
setTimeout(function(){showBackground(obj,endInt)},5);
}
}else{
var al=parseFloat(obj.style.opacity);al+=0.01;
obj.style.opacity=al;
if(al <(endInt/100))
{setTimeout(function(){showBackground(obj,endInt)},5);}
}
}
//关闭窗口
function closeWindow()
{
if(document.getElementById('back')!=null)
{
document.getElementById('back').parentNode.removeChild(document.getElementById('back'));
}
if(document.getElementById('mesWindow')!=null)
{
document.getElementById('mesWindow').parentNode.removeChild(document.getElementById('mesWindow'));
}

if(isIe){
setSelectState('');}
}

function testMessageBox1(ev)
{
var objPos = mousePosition(ev);
messContent="

组织两年内即将退休员工人数为

";
showMessageBox('数为',messContent,objPos,580,0);
[b]问题补充:[/b]
如何把不的DIV层的内容放进弹出层里?
[b]问题补充:[/b]
帮忙写全点呀

我不知道为什么,我把JS拿进去测试,有脚本错误?
[b]问题补充:[/b]


td align="center" style="width:120px" class="linebottom lineleft ">查看详细

我的弹出层事件就不能放了呀onclick="testMessageBox1

如何把两个联系起来呀

[b]问题补充:[/b]
是这样嘛a
[b]问题补充:[/b]
我把你的代码:

3.<br><br> 4. function dis(){<br><br> 5. var t=document.getElementsByTagName(&quot;div&quot;);<br><br> 6. for(i=0;i<t.length;i++){ <br> 7. if(t[i].style.background=="#fffffe"){ <br> 8. t[i].style.display="none"; <br> 9. } <br> 10. } <br> 11. } <br> 12. function aa1(){ <br> 13. dis(); <br> 14. document.getElementById("a1").style.display=""; <br> 15. } <br> 16. function aa2(){ <br> 17. dis(); <br> 18. document.getElementById("a2").style.display=""; <br> 19. } <br> 20. function aa3(){ <br> 21. dis(); <br> 22. document.getElementById("a3").style.display=""; <br> 23. } <br> 24.

25.

26.



27.


28.

29.

34.

37.

38.


30.a

31.


32.b

33.


35.c

36.


39.


40.

41.


42.
aaaaaaa


43.


44.


45.
bbbbbbb


46.


47.


48.
ccccc


49.


50.

51.

放进去测试

onclick="aa1(testMessageBox1(event))"
有弹出层,但是没有内容,有脚本错误,说没有对象
[b]问题补充:[/b]
它报我弹出DIV层的脚本错误pageX为空,
好像这里面定死了。
[b]问题补充:[/b]
哈哈 :idea: 帮帮我改改,以后会慢慢改进啦
[b]问题补充:[/b]
弹出层有出来但是遮层与显示层好像不同步,

DIV层内容好像始终都没有出现过?

function testMessageBox1(ev)
{
var objPos = mousePosition(ev);
messContent="

";
showMessageBox('要要',messContent,objPos,580,100);
}

不需要改吧
[b]问题补充:[/b]
当我点弹出层里空白处时,遮层后面就显示不全。

不知道是不是事件问题。

难道我点击时,DIV层内容会同步嘛

这样写就行了

a

function aa1(ev)
{

testMessageBox1(ev);

.....

}

function divshow1(val) { if(val=="1") { document.getElementById("t1").style.display="block"; document.getElementById("t2").style.display="none"; document.getElementById("t3").style.display="none"; } else if(val=="2") { document.getElementById("t1").style.display="none"; document.getElementById("t2").style.display="block"; document.getElementById("t3").style.display="none"; } else { document.getElementById("t1").style.display="none"; document.getElementById("t2").style.display="none"; document.getElementById("t3").style.display="block"; } }

弹出层1

弹出层2

弹出层3

[code="java"]
function divshow(id)
{
//保存所有弹出层的div的id
var array = ['t1','t2','t3'];

for(var i = 0;i<array.length;i++)
{
    if(array[i] == id)
        document.getElementById(array[i]).style.display="block"; 
    else
        document.getElementById(array[i]).style.display="none"; 
}


} 

[/code]

用我这种方式,
//保存所有弹出层的div的id

var array = ['t1','t2','t3'];

这样不管有多少个div也很容易修改,只要增加id到这个数组就行了

隐藏其他的所有的层很简单
var t=document.getElementsByTagName("div")
把需要做这种动作的层的style的其中一个不太重要的属性设置成统一的属性 这样就可以先判断
if(t[i].style.xxx==xxx)
这样就可以避免隐藏掉不该隐藏的层了 呵呵
我通常用background这个属性 例如白色的表达有很多 可以用一个特殊的#fffffe作为这个层的标识颜色

xxxxx

那你干脆上传你的这个页面代码,帮你看看

[code="java"]

function dis(){ var t=document.getElementsByTagName("div"); for(i=0;i<t.length;i++){ if(t[i].style.background=="#fffffe"){ t[i].style.display="none"; } } } function aa1(){ dis(); document.getElementById("a1").style.display=""; } function aa2(){ dis(); document.getElementById("a2").style.display=""; } function aa3(){ dis(); document.getElementById("a3").style.display=""; }


aaaaaaa
bbbbbbb
ccccc


[/code]

你把testMessageBox1 放到aa方法里去执行不就行了

你把需要做的事都放到一个onclick响应函数里面不就好了 我这个就是个示意例子

是这样

function aa1()
{

testMessageBox1();

.....

}

我晕菜 我觉得你应该看看js的基础

这个应该是不需要修改的,