JS备忘录(二) 【默认用Label显示数据,点击后用select修改数据】

需求:
   页面默认显示的时候为label,
   当鼠标点击上后,显示为select选择框,容许选择
 
     
实现
   1.javascript函数:
function makeSelectEnabled(_node){
var selects = _node.getElementsByTagName("select");
var labels = _node.getElementsByTagName("label");

var spans = _node.getElementsByTagName("span");

if(spans.length > 0){
spans[
0].style.padding = "0px";
spans[
0].parentNode.style.paddingTop = "0px";
spans[
0].parentNode.style.paddingBottom = "0px";        
}
        
if(selects.length > 0 && labels.length > 0){
    labels[
0].innerHTML = "";
    selects[
0].style.display = "block";
    selects[
0].focus();
    selects[
0].onblur = function(){
 labels[
0].appendChild(_createTextNode(this.value));
this.style.display="none";    
            }
     }
            
}

2. jsp页面使用(s标签为struts2标签)
<tr>
    
<th>Log level</th>
      
<td onclick="makeSelectEnabled(this)" class="editThisAttribute">
        
<span> 
           
<s:label key="mozartManagerConf.mangerLogLevel" />
            <s:select id="mangerLogLevel"
               cssStyle
="display:none" list="logLevelList" 
               name
="xxxx.LogLevel"
               value
="xxx.mangerLogLevel" 
               headerKey
="" headerValue="" /> 
         
</span>
     
</td>
</tr>

注意:
1.使用struts2的标签select显示下拉列表
     list对应的logLevelList为下拉数据,value="mozartManagerConf.mangerLogLevel" 为当前显示数据

2.在构造函数中填充
logLevelList(每次请求都会重新初始化一个Action实例)

3.具体实例可以参见struts2-showCase




posted on 2007-06-12 16:50 想飞就飞 阅读(831) 评论(0)  编辑  收藏 所属分类: JAVASCRIPT备忘录


只有注册用户登录后才能发表评论。


网站导航:
 

公告


导航

<2007年6月>
272829303112
3456789
10111213141516
17181920212223
24252627282930
1234567

统计

常用链接

留言簿(13)

我参与的团队

随笔分类(69)

随笔档案(68)

最新随笔

搜索

积分与排名

最新评论

阅读排行榜

评论排行榜