刚刚写的select操作,与DIV弹出

sxpyrgz

浏览: 72459 次
性别:
来自: 北京

最近访客更多访客>>

jiedushi

fd2020

zhangyuanjava

非你BOOK

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

javascript

prototype XHTML HTML

<!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>
<meta content="text/html; charset=GBK" http-equiv="Content-Type" />
<title>无标题 1</title>
<style type="text/css">
#loader {
padding:0;
margin:0;
position:absolute;
top:0; left:0;
width:100%; height:100%;
background:#ededed;
z-index:999;
display:none;
vertical-align:center;
filter:alpha(opacity=80);
-moz-opacity:0.8;
opacity: 0.8;
}
#top {
border:1px solid #cee3ff;
padding:0;
margin:0;
position:absolute;
top:100 ; left:300;
width:300px; height:200px;
background:#ededed;
vertical-align:center;
z-index:1000;
display:none;
text-align: center;

}
html,body{
margin:0px;
width:100%;
height:100%;
}
</style>
<script type="text/javascript">
var divMessage={
bottomId : "loader", //最底层DIV也就是全屏DIV
topId : "top", //顶层DIV
textAreaId        : "textarea", //div中文本框ID
          divBottom : function(){   //得到底层对象
     return document.getElementById(this.bottomId);
     },
     divTop:function(){ //得到顶层对象
     return document.getElementById(this.topId);
     },
     textObj:null,
     textAreaObj:function(){ //得到区域对象
     return document.getElementById(this.textAreaId);
     }
}

divMessage.show=function(textObj){
divMessage.textObj = textObj;
document.getElementById(this.textAreaId).value=textObj.value;
divMessage.divTop().style.display ='block';
divMessage.divBottom().style.display ='block';

}
divMessage.hidden= function(){
divMessage.divTop().style.display ='none';
divMessage.divBottom().style.display ='none';
}
//点击DIV上的确定改变文本框的值
divMessage.changeObj=function(textId){
divMessage.textObj.value = document.getElementById(textId).value;
divMessage.hidden();

}
/**
* 以下三个函数操作SELECT可以给
* @param id为要操作的SELECT的ID
* 功能：可以 var sel =new SelOperate（id）
*/
function SelOperate(id)
{
this.id = id;
this.sel = document.getElementById(id);
}
/**
*清楚select中的选项 sel.clean();
*/
SelOperate.prototype.clean=function()
{
var length = this.sel.options.length;
while(length>0){
this.sel.removeChild(this.sel.options[0]);
length--;
}
}
/**
*增加select中的OPTION;
*/
SelOperate.prototype.add=function(selValue,selName)
{
var option = document.createElement("option");
option.setAttribute("value", selValue);
option.innerHTML= selName;
this.sel.appendChild(option);
}
/**
*将select符合条件的值选中
*/
SelOperate.prototype.selChecked=function(objValue){
for(var i = 0 ;i<this.sel.length;i++){
if(this.sel[i].value==objValue){
this.sel.options[i].setAttribute("selected",true);
}
}
}

/**********************************************/

function addOptions(){
var sel= new SelOperate("selTest");
sel.clean();
for(var i=0;i<5;i++){

sel.add("value"+1,"name"+i)
}
}

</script>

</head>

<body>
<div id="top">
<div id="title" style="height: 23px;padding:5px;background-image: url('<%=path%

>/ecgrid/images/gird/footerBg.gif');" >请输入提示信息</div>
<textarea id="textarea" style="width:100%;height:200px;border:0px;margin:1px;

overflow: auto;"></textarea>
<input type="button" name="确定" class="dataForm_button" value="确定"

onclick="divMessage.changeObj('textarea')">

</div>
<div id="loader"><iframe frameborder="0" width="100%" height="100%" src=""></iframe></div>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
a<br>
<select id="selTest">
<option>哈哈哈哈</option>
</select>
<input type="text" value="show" onclick="divMessage.show(this)" >
<input type="button" value="show" onclick="addOptions()" >
</body>

</html>

分享到：

经典的一个表结构 | javascript内联与继承

2009-03-19 19:25
浏览 1380
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论