data.jsp页面, 下面列出的是 <body>部分
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <body> <table id="content"> <tr id="title"> <th width="11%" title="设备ID">设备ID</th> <th width="12%" title="设备名称">设备名称</th> <th width="11%" title="设备状态">设备状态</th> <!-- 其它字段略去 --> <th width="11%" title="授权码">授权码</th> <th width="11%" title="审批状态">审批状态</th> </tr>
<!-- 会调用后台 action的 getDeviceTypeList()方法--> <s:set name="deviceTypeResource" value="deviceTypeList"/> <s:set name="deviceStateResource" value="deviceStateList"/> <s:iterator value="dataList"> <tr class="mouseOut" onmouseover="Mouse.over(this)" onmouseout="Mouse.out(this)" onmousedown="Mouse.down(this)" ondblclick="Buttondata.dbclick(this)"> <td title="${deviceId}">${deviceId}</td> <td title="${deviceName}">${deviceName}</td> <td title="<h:resource list="deviceStateResource" value="deviceState"/>"> <h:resource list="deviceStateResource" value="deviceState"/> </td> <!-- 其它略去--> <td title="${licenseKey}">${licenseKey}</td> <td title="${approvalState}"> <h:resource list="deviceApprovalStateList" value="approvalState"/>
<!-- <s:hidden /> 会自动将设置id值，id值与name值一样，如果没有认为指定的话-->
<s:hidden name="approvalState" /> <s:hidden name="deviceState" /> <s:hidden name="licenseKey" /> </td>
<!-- 选中该记录后，进行其它操作，如更新 查看 删除 会将deviceId传递到action中，多个参数用& 分割 -->
<td id="params" class="hidden">deviceId=${deviceId}</td> </tr> </s:iterator> </table> </body> </html>
data.jsp页面, 下面列出的是 <head>部分, 里面有js 先列出 jQuery实现
界面上 原子操作菜单按钮是如下的形式
<div>
<a code="${permisCode}" href="#" style="background-image:url('${imageUrl}')" onclick="ThirdMenu.click('${permisUrl}', '${permisName}', '${permisId}', '${showType}')" onfocus="this.blur()">${permisName}
</a> </div>
jQuery实现，未必对应这个界面，方法都是一样的
<script type="text/javascript"> $(document).ready(function(){ $("#content tr.data").mousedown(function(e){ auditFlag = $(this).find('>td input[id="auditFlag"]').val() status = $(this).find('>td input[id="status"]').val() showButton(false,'DEVICEINFO_SIGN') // 列一个调用showButton即可 }); }) function showButton(show, code){ btn = $(parent.parent.document).find('#THIRDMENUFRAME').contents().find('a[code="'+code+'"]'); if(show){ btn.show() } else { btn.hide() } } </script>
mootools实现，未必对应这个界面，方法都是一样的
界面上 原子操作菜单按钮是如下的形式
<div>
<a code="${permisName}" href="#" style="background-image:url('${imageUrl}')"
onclick="ThirdMenu.click('${permisUrl}', '${permisName}', '${permisId}', '${showType}')"
onfocus="this.blur()">${permisName}
</a>
</div>
<script type="text/javascript"> window.addEvent('domready', function() { //初始化时只加载新建，修改，删除，查看功能 //其它按钮请自己加 showButton(false,"生成授权码"); //鼠标点击某一条记录 $$("#content tr.mouseOut").addEvent('mousedown',function(event){ //感觉不能使用 ">td input[id='approvalState']" //设备状态 var stateFlag = $(this).getElement('td input[id="deviceState"]').value; //licenseKey 授权码 var licenseKey = $(this).getElement('td input[id="licenseKey"]').value; if(licenseKey==""){ //授权码为空是，生成授权码按钮可以使用 showButton(true,"生成授权码"); }else{ showButton(false,"生成授权码"); } //对于审批状态，还没有理清，暂时只加入少量的 if(stateFlag=="5"){ //调试状态 //显示启用，其它不显示 showButton(true,"设备启动"); } }); }); /** * 显示或隐藏按钮 */ function showButton(show, code){ // contentDocument属性，是获取标准的jframe的html内容的属性 btn = $(parent.parent.document).getElement('#THIRDMENUFRAME ').contentDocument.getElement('a[code="'+code+'"]') ; if(btn==null){ return; } if(show){ //btn.fade(1); //1代表可见 btn.getParent().setStyle("display","block"); }else{ //btn.fade(0); // 0代表不可见 btn.getParent().setStyle("display","none"); } } /** * getElement 类似于 jQuery的 find()方法 **/
