HTML网页中div如何挡住select
发布网友
发布时间：2022-04-24 05:36
共1个回答
热心网友
时间：2022-04-19 09:09
错误的示例，可见如下代码(借用了某位网友的代码)<HTML<HEAD<TITLEZ-Index</TITLE<scriptfunctionsetindex(){div1.style.zIndex=text1.value;
select1.style.zIndex=text2.value;
getindexes();}functiongetindexes(){text1.value=div1.style.zIndex;
text2.value=select1.style.zIndex;
text3.value=5;}</script</HEAD<BODYonload=getindexes()Div<inputtype=textvalue=id=text1name=text1<pSelect<inputtype=textvalue=id=text2name=text2<pIFrame<inputtype=textvalue=id=text3name=text3<p<inputtype=buttonvalue=SetZ-Indexid=button1name=button1onclick=setindex()<DIVid=div1name=div1style=width:200;height:200;background-color:lightblue;
position:absolute;left:350;top:250;z-index:DIV</DIV<selectid=select1name=select1style=;position:absolute;left:300;top:400;width=300;z-index:size=1<optionOption1<optionOption2<optionOption3</select<IFRAMEid=iframe1name=iframe1src=scroll=nonestyle=width:100;height:115;position:absolute;
left:400;top:300;border-color:green;z-index:5</iframe</BODY</HTML
查了一下网上的资料，说是可以用iframe做底，挡住select，也就达到了div挡住select的效果。试了一下，确实有效，下面是源码；<html<scriptfunctionsetZIndex(isShow){varDivRef=document.getElementById('menu');varIfrRef=document.getElementById('back');if(isShow){DivRef.style.display=block;IfrRef.style.display=block;IfrRef.style.width=DivRef.offsetWidth;
IfrRef.style.height=DivRef.offsetHeight;
IfrRef.style.top=DivRef.style.top;
IfrRef.style.left=DivRef.style.left;
IfrRef.style.zIndex=DivRef.style.zIndex-1;}else{DivRef.style.display=none;IfrRef.style.display=none;}}</script<FIELDSETid=menustyle=z-index:999;width:500;overflow-x:auto;height:100;overflow-y:auto;position:absolute;display:none;border:1pxdotted#6699FF;background:#E5F0FF<LEGENDACCESSKEY=C
CreditCardInformation</LEGEND<P<LABELACCESSKEY=V<INPUTTYPE=radioNAME=cardVALUE=visaVisa</LABEL<LABELACCESSKEY=M<INPUTTYPE=radioNAME=cardVALUE=mcMasterCard</LABEL<BR<LABELACCESSKEY=NNumber:<INPUTTYPE=textNAME=number</LABEL<BR<LABELACCESSKEY=EExpiry:<INPUTTYPE=textNAME=expiry</LABEL</P</FIELDSET<iframeid=backsrc=scrolling=noframeborder=0style=position:absolute;top:0px;left:0px;display:none;</iframe<divstyle=z-index:3;text-align:center;<Select<option
对div也是一样的代码。不再重复。
