select发展史超强第2/2页_表单特效

点击运行可以看到效果:

按回车键输入新内容，按DEL删除选中内容
 
<body bgcolor="#fef4d9" onload="s1.focus();"> 
<script language="JavaScript"> 
 
</script> 
<select name=s1 onkeydown="catch_keydown(this);" onkeypress="catch_press(this);" style="font-size:12px;"><option>---</option></select>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:
[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title></title> 
<style type="text/css"> 
 
</style> 
<script  lanuage="JScript"> 
function  turnit(ss) 
{

if  (ss.style.display=="none")   
    {ss.style.display=""; 
    for (var i=1;i<4;i++) 
{ 
if (eval('t'+i).innerText==text1.value) 
eval('t'+i).className='ss' 
else 
eval('t'+i).className='' 
} 
}

else 
    {ss.style.display="none";    
   } 
} 
function sele(tid) 
{ 
bb.style.display='none'; 
text1.value=tid.innerText; 
} 
function over(tid) 
{ 
for (var i=1;i<4;i++) 
{ 
eval('t'+i).className='' 
} 
tid.className='ss' 
if(typeof(prevObj)!='undefined') 
prevObj.bgColor=''; 
prevObj=tid; 
}

function openb() 
{ 
if (bb.style.display=='') 
bb.style.display='none' 
} 
</script> 
<style type="text/css"> 
 
</style> 
</head>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:

<center><sup><font face="隶书" color="blue">上标是不是这个？</font></sup><font size="6" face="华文行楷" color="red">如果要想以其他的文字作为上标该怎么做啊？</font><sub><font face="黑体" color="green"><b><i>下标是不是这个？</b></i></font></sub>

function clickE() 
{ 
if(window.event.srcElement.id !='mm') 
document.all.dropdownOption.style.visibility='hidden'; 
}

document.onclick = clickE 
window.onload = init 
</script>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:

<html>

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>EditSelect</title> 
<script> 
scHTML='<div id="selectcontent" class="selectdiv" style="visibility:hidden;"><iframe id=selframe frameborder=0 height=100%></iframe><div id="selecthtml" class="selectcontent">selectÁÐ±í</div></div>' 
document.write(scHTML) 
vDiv=selectcontent 
vDivHtml=selecthtml

var redge=document.body.clientWidth-vleft 
   var bedge=document.body.clientHeight-vtop

if (!combo.width) {vDiv.style.width=pTable.offsetWidth} else {vDiv.style.width=combo.width}

if (combo.height==0) 
      { 
        vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2 
        vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2 
      } 
      else 
      { 
         if (htmltable.offsetHeight>combo.height) 
          { 
            vDiv.style.pixelHeight=combo.height 
            vDivHtml.style.pixelHeight=combo.height

}  
           else  
           { 
           
              vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2 
              vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2 
           } 
    
       } 
     
    vDivHtml.scrollTop=0 
     
    if (redge<vDiv.offsetWidth) 
      vDiv.style.left=vleft-1-(vDiv.offsetWidth-redge) 
        else 
      vDiv.style.left=vleft-1

if (bedge<vDiv.offsetHeight) 
    //vDiv.style.top=vtop-vDiv.offsetHeight-pDiv.offsetHeight 
    vDiv.style.top=vtop-vDiv.offsetHeight+bedge 
         else 
      vDiv.style.top=vtop 
       
     
    vDivHtml.style.width=parseInt(vDiv.style.width) 
      vDiv.style.visibility="visible" 
  } 
   
  this.add=function(text){ 
     combo.options[combo.options.length]=text 
  } 
   
  this.about=function(){ 
   
 } 
}

function mo(obj){ 
obj.style.backgroundColor="#000099" 
obj.style.color="#ffffff" 
}

function mu(obj){ 
obj.style.backgroundColor="" 
obj.style.color="#000000" 
}

document.onmousedown=function(){ 
if (vDiv.style.visibility=="visible"){ 
mx=event.x + document.body.scrollLeft 
my=event.y + document.body.scrollTop;

x1=vDiv.offsetLeft 
y1=vDiv.offsetTop

x2=vDiv.offsetLeft+vDiv.offsetWidth 
y2=vDiv.offsetTop+vDiv.offsetHeight

if (mx<x1 || my<y1 || x2<mx || y2<my)  
   {  
     vDiv.style.visibility='hidden' 
   } 
} 
} 
</script>

.selectdiv 
{ 
position: absolute;  
width:100; 
overflow:hidden; 
} 
.select{ 
border-collapse: collapse; 
border:1px solid #7F9DB9 
} 
</style> 
</head>

<center> 
<table border="0" width="234"> 
    <tr> 
        <td width="151" align="center"><font size="2">可编辑的Select</font></td> 
        <td><script> 
var sel1=new editselect("select1","25","可编辑的Select",""); 
sel1.add("<marquee behavior=alternate><img src='http://www.blueidea.com/articleimg/bbsimg/icon6.gif' align='absmiddle'>  <B><font color=#22FF22>知</font><font color=#FF2222>往</font><font color=#001199>观</font><font color=#00fffa>来</font></B></marquee>") 
sel1.add("<img src='http://www.blueidea.com/articleimg/bbsimg/icon7.gif' align='absmiddle'>  微风香水") 
sel1.add("<img src='http://www.blueidea.com/articleimg/bbsimg/icon8.gif' align='absmiddle'>  阳光锈了") 
sel1.add("<img src='http://www.blueidea.com/articleimg/bbsimg/icon9.gif' align='absmiddle'>  <B><font color=#22FF22>观</font><font color=#FF2222>往</font><font color=#001199>知</font><font color=#00fffa>来</font></B>") 
</script></td> 
    </tr> 
    <tr> 
        <td width="151" align="right">　</td> 
        <td> </td> 
    </tr> 
</table>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title></title> 
<style type="text/css"> 
 
</style> 
<script  lanuage="JScript"> 
function  turnit(ss) 
{

if  (ss.style.display=="none")   
    {ss.style.display=""; 
}

else 
    {ss.style.display="none";    
   } 
} 
function sele(tid) 
{ 
bb.style.display='none'; 
text1.value=tid.innerText; 
} 
function over(tid) 
{ 
for (var i=1;i<4;i++) 
{ 
eval('t'+i).className='' 
} 
tid.className='ss' 
} 
function out(tid) 
{ 
if (bb.style.display!='none') 
tid.className='' 
} 
</script> 
<style type="text/css"> 
 
</style> 
</head>

</table> 
      </div></td> 
  </tr> 
</table>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

点击运行可以看到效果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title></title> 
<style type="text/css"> 
 
</style> 
<script  lanuage="JScript"> 
function  turnit(ss) 
{

if  (ss.style.display=="none")   
    {ss.style.display=""; 
}

else 
    {ss.style.display="none";    
   } 
} 
function sele(tid) 
{ 
bb.style.display='none'; 
text1.value=tid.innerText; 
} 
function over(tid) 
{ 
for (var i=1;i<4;i++) 
{ 
eval('t'+i).className='' 
} 
tid.className='ss' 
} 
function out(tid) 
{ 
if (bb.style.display!='none') 
tid.className='' 
} 
</script> 
<style type="text/css"> 
 
</style> 
</head>

</table> 
      </div></td> 
  </tr> 
</table>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

select发展史超强第2/2页

文章评论

同类文章

最近更新

热点排行

select发展史 超强第2/2页

文章评论

同 类 文 章

最 近 更 新

热 点 排 行

select发展史超强第2/2页

同类文章

最近更新

热点排行