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

最新推荐文章于 2021-04-19 11:46:19 发布

sxpyrgz

最新推荐文章于 2021-04-19 11:46:19 发布

阅读量82

点赞数

分类专栏： javascript 文章标签： prototype XHTML HTML

javascript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

<!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="确定"

οnclick="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" οnclick="divMessage.show(this)" >
<input type="button" value="show" οnclick="addOptions()" >
</body>

</html>

sxpyrgz

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
刚刚写的select操作,与DIV弹出

无标题 1#loader { padding:0; margin:0; position:absolute; top:0; left:0; width:100%; height:100%; background:#ededed; z-index:999; display:none; vertical-align:cente...
复制链接

扫一扫