需求：
页面默认显示的时候为label，
当鼠标点击上后，显示为text框，容许修改
实现
1.javascript函数：
//显示input框 并设置css(这里是inputTextField)
function makeInputEnabled(_node){
var spans = _node.getElementsByTagName("span");
var inputs = _node.getElementsByTagName("input");
var labels = _node.getElementsByTagName("label");
if(spans.length > 0){
spans[0].style.padding = "0px";
spans[0].parentNode.style.paddingTop = "0px";
spans[0].parentNode.style.paddingBottom = "0px";
}
if(inputs.length > 0 && labels.length > 0){
labels[0].innerHTML = "";
inputs[0].style.display = "block";
inputs[0].focus();
inputs[0].className = "inputTextField";
inputs[0].type="text";
var inputSize = 10;
var inputValueLength = inputs[0].value.length;
if(inputValueLength > 10) inputSize = inputValueLength + 1;
inputs[0].size = inputSize;
inputs[0].onblur = function(){
labels[0].appendChild(_createTextNode(this.value));
this.style.display="none";
}
}
function _createTextNode(name){
return document.createTextNode(name);
}
2. jsp页面使用(s标签为struts2标签)
<table class="propsReadTable">
<tr>
<th>
Monitoring Interval for High Availability (HA)
</th>
<td onclick="makeInputEnabled(this)" class="editThisAttribute">
<span>
<s:label key="bean.prop" />
<s:hidden key="bean.prop" cssClass="inputTextField" />
</span>
</td>
</tr>
</table>
