Posted in Javascript onJune 16, 2014
页面文件
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title></title> <script type="text/javascript" src="jquery-1.6.min.js"></script> <script type="text/javascript" src="queryi18n.js"></script> <script type="text/javascript"> </script> </head> <body oncontextmenu="return false"> <form id="i18nform"> <div id="i18ntablediv" style="width: 90%;"> <table id="i18ntable" border="1px" width="90%"> <tr> <th width='45%' height='20px'>key</th> <th width='45%' height='20px'>value</th> <th width='5%' height='20px'>value</th> </tr> </table> </div> <div id="addtrdiv" style="width: 10%; float: right;"> <a href="#" class="easyui-linkbutton" iconCls="icon-add" onclick="addtr()"><span key="ss" class="paltform-i18n">添加行</span></a> </div> <div class="button_area_absolute"> <table width="90%"> <tr> <td align=center><a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="savei18ninfo()"><span key="save" class="paltform-i18n">保存</span></a></td> </tr> </table> </div> </form> </body> </html>
js文件
//保存国际化文件 function savei18ninfo(){ var i18ninfo = geti18ninfo(); alert(i18ninfo); } //获取i18n值 function geti18ninfo(){ var key = ""; var value = ""; var i18ndata = ""; var table = $("#i18ntable"); var tbody = table.children(); var trs = tbody.children(); for(var i=1;i<trs.length;i++){ var tds = trs.eq(i).children(); for(var j=0;j<tds.length;j++){ if(j==0){ if(tds.eq(j).text()==null||tds.eq(j).text()==""){ return null; } key = "key\":\""+tds.eq(j).text(); } if(j==1){ if(tds.eq(j).text()==null||tds.eq(j).text()==""){ return null; } value = "value\":\""+tds.eq(j).text(); } } if(i==trs.length-1){ i18ndata += "{\""+key+"\",\""+value+"\"}"; }else{ i18ndata += "{\""+key+"\",\""+value+"\"},"; } } i18ndata = "["+i18ndata+"]"; return i18ndata; } var clientWidth = document.documentElement.clientWidth; var clientHeight = document.documentElement.clientHeight; var div_left_width = 200; var tempWidth = 0; /** * 描述:页面自适应 */ $(window).bind("resize",function(){ resizeLayout(); }); function resizeLayout(){ try{ clientWidth = document.documentElement.clientWidth; var div_left_width = $("#left").width()+11; $("#cc").layout("resize"); $('#userquery').panel('resize',{width:clientWidth-div_left_width}); $('#10100801').datagrid('resize',{width:clientWidth-div_left_width}); $('#userrange').combobox({ width : $('#right').width() * 0.35 }); }catch(e){ } } function initResize(){ //自动适应页面大小 $(".layout-button-left").bind("click",function(){ $('#userquery').panel('resize',{width:clientWidth-28}); $('#10100801').datagrid('resize',{width:clientWidth-28}); $(".layout-button-right").bind("click",function(){ $('#userquery').panel('resize',{width:tempWidth}); $('#10100801').datagrid('resize',{width:tempWidth}); }); }); } function tdclick(tdobject){ var td=$(tdobject); td.attr("onclick", ""); //1,取出当前td中的文本内容保存起来 var text=td.text(); //2,清空td里面的内容 td.html(""); //也可以用td.empty(); //3,建立一个文本框,也就是input的元素节点 var input=$("<input>"); //4,设置文本框的值是保存起来的文本内容 input.attr("value",text); input.bind("blur",function(){ var inputnode=$(this); var inputtext=inputnode.val(); var tdNode=inputnode.parent(); tdNode.html(inputtext); tdNode.click(tdclick); td.attr("onclick", "tdclick(this)"); }); input.keyup(function(event){ var myEvent =event||window.event; var kcode=myEvent.keyCode; if(kcode==13){ var inputnode=$(this); var inputtext=inputnode.val(); var tdNode=inputnode.parent(); tdNode.html(inputtext); tdNode.click(tdclick); } }); //5,将文本框加入到td中 td.append(input); var t =input.val(); input.val("").focus().val(t); // input.focus(); //6,清除点击事件 td.unbind("click"); } function addtr(){ var table = $("#i18ntable"); var tr= $("<tr><td height='20px' onclick='tdclick(this)'>"+"</td><td height='20px' onclick='tdclick(this)'>"+"</td><td height='20px' align='center' onclick='deletetr(this)'><font size='2' color='red'>"+"删除"+"</font></td></tr>"); table.append(tr); } function deletetr(tdobject){ var td=$(tdobject); td.parents("tr").remove(); }
一个可以增加和删除行的table并可编辑表格中内容
- Author -
whsnow声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@