本文介绍如何使用Struts2框架中的s:radio组件根据选择动态改变s:textfield组件的可写状态。通过JavaScript实现选择项变化时即时更新界面元素属性。
此界面的功能就是通过s:radio选择改变一些s:textfield是否可写，代码如下：
<!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">
<%@ taglib prefix="s" uri="/struts-tags"%>
<head>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>
<title>无标题文档</title>
</head>
<body onload="return tmplatecheck()">
<s:form action="templatetype!TemplateAddEdit.action">
<table align="center" class="editTable">
<tr>
<th>
同步地址类型
</th>
<td>
<s:radio name="TemplateTypeForm.Sp_synchro_type_id" list="#{'1':'不可写,'2':'可写'}" listKey="key" listValue="value" value="1" onclick="return tmplatecheck()"></s:radio>
</td>
<td>
<s:textfield name="TemplateTypeForm.mo_mobile" ></s:textfield>
</td>
</tr>
</table>
</s:form>
</body>
</html>
<script type="text/javascript">
function tmplatecheck() {
var Sp_synchro_type_id = document
.getElementsByName('TemplateTypeForm.Sp_synchro_type_id');
if (Sp_synchro_type_id != null) {
var i;
for (i = 0; i < Sp_synchro_type_id.length; i++) {
if (Sp_synchro_type_id[i].checked) {
//alert(Sp_synchro_type_id[i].value);
if (Sp_synchro_type_id[i].value == 1) {
document.getElementsByName("TemplateTypeForm.mo_mobile")[0].readOnly = true;
} else {
document.getElementsByName("TemplateTypeForm.mo_mobile")[0].readOnly = false;
}
}
}
}
return true;
}
</script>
值得注意的是几个取值的地方。
本来希望通过JS来改变不同的界面显示，但无耐时间紧，又不会JS，所以只有出此下策。加油！
扫一扫
34
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
