Quickj Code Generator beta v1.0

  實在是閒着無聊,想到寫HTML如此勞累,乾脆用JS寫個工具來代替令人討厭的HTML代碼吧.說幹就幹,花了三個小時,簡單實用的TOOLS出來.

 

HTML部分:

<form>
    <h3>Quickj Code Generator beta v1.0</h3>
    <h5>代碼</h5>
    <textarea id="tareaid" style="width:30%;height:200px;">
    </textarea>
    <br />
    Java BEAN:<input type="text" id="beanname">
    <a id="a_areaid" href="#">添加變量</a>
    <input type="button" value="OK" id="subbtn">
    <table id="innerbody" align="center">
    </table>
</form>

 

  JS部分:

<mce:script type="text/javascript"><!-- $(function(){ $("#a_areaid").click(function(){ var le = $("input[name^='valname']").length; var corecode="<tr><td>中文:</td><td><input type='text' name='valname"+le+"' id='valname"+le+"' ></td><td>英文:</td><td><input type='text' name='envalname"+le+"' id='envalname"+le+"' ></td><td><select id='valtype"+le+"' name='valtype"+le+"'><option value='1'>TEXT</option><option value='2'>SELECT</option><option value='3'>HIDDEN</option><option value='4'>DATE</option></select><a href="#" mce_href="#" onclick='removeval("+le+");'><sapn>刪除</sapn></a></td></tr>"; $("#innerbody").append(corecode); }); $("#subbtn").addClass('btn').click(function(){ var base=""; $("input[name^='valname']").each(function(index){ var type = $("#valtype"+index).val(); var b_base = ""; var objn = $("#beanname").val(); var bname = $(this).val(); var bnameen = $("#envalname"+index).val(); if(type==1){ //TEXT b_base = textcode(objn,bname,bnameen); }else if(type==2){ b_base = selectcode(objn,bname,bnameen); }else if(type==3){ b_base = hiddencode(objn,bname,bnameen); }else{ b_base = datecode(objn,bname,bnameen); } base+=b_base; }); //alert(base); //打印最終代碼 //$("#testtableid").addClass('tb2').html(base); $("#tareaid").val(base); }); }); function removeval(id){ $("#valname"+id).parents("tr").empty(); } function textcode(objname,cnval,enval){ var name = objname+"__"+enval; var value = "${"+objname+"."+enval+"!''}"; var code = "<tr><td>"+cnval+"</td><td><input type=/"text/" name=/""+name+"/" id=/""+name+"/" value=/""+value+"/"></td></tr>"; return code; } function selectcode(objname,cnval,enval){ var name = objname+"__"+enval; var value = "${"+objname+"."+enval+"!''}"; var code = "<tr><td>"+cnval+"</td><td><select name=/""+name+"/" id=/""+name+"/" value=/""+value+"/"><option>--請手動填寫--</option></select></td></tr>"; return code; } function hiddencode(objname,cnval,enval){ var name = objname+"__"+enval; var value = "${"+objname+"."+enval+"!''}"; var code = "<tr><td>"+cnval+"</td><td><input type=/"hidden/" name=/""+name+"/" id=/""+name+"/" value=/""+value+"/"></td></tr>"; return code; } function datecode(objname,cnval,enval){ var name = objname+"__"+enval; var value = "${"+objname+"."+enval+"?string('yyyy-MM-dd')}"; var code = "<tr><td>"+cnval+"</td><td><input type=/"text/" name=/""+name+"/" id=/""+name+"/" onclick=/"calShow('"+name+"','y-mm-dd');/" value=/""+value+"/"></td></tr>"; return code; } // --></mce:script>

 

 

效果: