<form id="addNewsFormData" name="addNewsFormData" isCheck="true" action="controller.SysRuleModelController">
<table id="addNewsTableId" class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1" >
<tr>
<th> 类型:</th>
<td >
<select id="dtomodelType" name="modelType">
<option value="1" >业务模型</option>
<option value="2" >实体类</option>
</select>
</td>
<th> 中文名 :</th>
<td >
<input type="text" class="text" id="dtochName" name="chName" notNull="false" maxLength="50" value="" />
</td>
<th> 英文名 :</th>
<td >
<input type="text" class="text" id="dtoenName" name="enName" notNull="false" maxLength="100" value="" />
</td>
</tr>
<tr>
<th> 备注 :</th>
<td colspan="5">
<textarea id="dtoremark" name="remark" maxLength="100" rows="5" cols="60"></textarea>
</td>
</tr>
</table>

属性管理
<div class="contentPanel">
<table id="tab" class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1">
<tr>
<td style="width: 5px;">序号</td>
<td>属性中文名</td>
<td>属性英文名</td>
<td>数据类型</td>
<td>长度</td>
<td>引用字典编码</td>
<td>描述</td>
<td>操作</td>
</tr>
<tr id="1">
<td><input type="text" name="modelAttrs[0].sequence" value="1"></td>
<td><input type="text" class="text" name="modelAttrs[0].chName" notNull="false" maxLength="50" value="" ></td>
<td><input type="text" class="text" name="modelAttrs[0].enName" notNull="false" maxLength="100" value="" ></td>
<td>
<select name="modelAttrs[0].dataType" >
<option value="1" >字符型</option>
<option value="2" >数字型</option>
<option value="3" >日期型</option>
<option value="4" >浮点型</option>
</select>
</td>
<td><input type="text" class="text" name="modelAttrs[0].dataLong" maxLength="50" value="" ></td>
<td><input type="text" class="text" name="modelAttrs[0].dictCode" maxLength="50" value="" ></td>
<td><input type="text" class="text" name="modelAttrs[0].remark" maxLength="50" value="" ></td>
<td><a href="#" onclick="deltr(1)">删除</a></td>
</tr>
</table>
<table class="formTableSwap" border="0" align="center" cellpadding="0" cellspacing="1">
<tr><td style="text-align:right;width: 800px;"><input type="button" id="but" value="增加"/></td></tr>
</table>

</form>

</div>

</body>
<script type="text/javascript">
$(document).ready(function(){
//增加<tr/>
$("#but").click(function(){
var _len = $("#tab tr").length;
alert(_len)
$("#tab").append("<tr id="+_len+" align='center'>"
+'<td><input type="text" name="modelAttrs['+(_len-1)+'].sequence" value="'+_len+'"></td>'
+'<td><input type="text" class="text" name="modelAttrs['+(_len-1)+'].chName" notNull="false" maxLength="50" value="" ></td>'
+'<td><input type="text" class="text" name="modelAttrs['+(_len-1)+'].enName" notNull="false" maxLength="100" value="" ></td>'
+'<td><select name="modelAttrs['+(_len-1)+'].dataType">'
+'<option value="1" >数字型</option>'
+'<option value="2" >字符型</option>'
+'<option value="3" >日期型</option>'
+'<option value="4" >浮点型</option>'
+'</select></td>'
+'<td><input type="text" class="text" name="modelAttrs['+(_len-1)+'].dataLong" maxLength="50" value="" ></td>'
+'<td><input type="text" class="text" name="modelAttrs['+(_len-1)+'].dictCode" maxLength="50" value="" ></td>'
+'<td><input type="text" class="text" name="modelAttrs['+(_len-1)+'].remark" maxLength="50" value="" ></td>'
+"<td><a href=\'#\' onclick=\'deltr("+_len+")\'>删除</a></td>"
+"</tr>");
});

});

//删除<tr/>
function deltr(index){
//var _len = $("#tab tr").length;
$("tr[id='"+index+"']").remove();//删除当前行
}

js动态添加<tr><td>的更多相关文章

  1. JS从后台获取数据,前台动态添加tr标签中的td标签

    功能描述: 要求从后台查询该省份的所有城市,然后动态的再前台固定的tr标签中添加相应的td标签来展示城市基本信息: 文章目录 #一.前台jsp及js源码 jsp:在固定的tr标签中添加一个id,通过j ...

  2. js 动态添加表单 table tr

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. form表单 无法提交js动态添加的表单元素问题。。

    第一种情况, 这种情况js动态添加的表单元素是不能提交到服务器端的 <table> <form method="post" action=" url   ...

  4. 使用js动态添加组件

    在文章开始之前,我想说两点 1 自己初学js,文章的内容在大神看来可能就是不值一提,但是谁都是从hello world来的,望高   手不吝指教# 2 我知道这个标题起的比较蛋疼,大家看图就能说明问题 ...

  5. js动态添加onload、onresize、onscroll事件(另类方法)

    js动态添加onload.onresize.onscroll事件(另类方法)   window 的 onload.onresize.onscroll 事件,跟其他的事件不一样,它不能用 attachE ...

  6. 【原生js】js动态添加dom,如何绑定事件

    首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...

  7. 原生JS动态添加和删除类

    原生JS动态添加和删除类 由于需要, 给按钮组监听点击事件(要求用事件委托),当有一个按钮被点击时,相应的给该按钮添加一个类(激活类),其他没有点击的按钮就要移出该类 添加和和删除类有三种方法 首先等 ...

  8. MUI 里js动态添加数字输入框后,增加、减少按钮无效

    numbox 的自动初化是在 mui.ready 时完成的mui 页面默认会自动初始化页面中的所有数字输入框,动态构造的 DOM 需要进行手动初始化.比如:您动态创建了一个 ID 为 abc 的数字输 ...

  9. 原生js动态添加style,添加样式

    原生js动态添加style,添加样式 第一种 var style="[assign-url='"+str+"']{display:initial}"; var ...

随机推荐

  1. 几款常用的在线API管理工具(是时候抛弃office编写接口文档了)

    在项目开发过程中,总会涉及到接口文档的设计编写,之前使用的都是ms office工具,不够漂亮也不直观,变更频繁的话维护成本也更高,及时性也是大问题.基于这个背景,下面介绍几个常用的API管理工具,方 ...

  2. 详解rel 属性及noflow

    rel属性的意思是指: 当前页和指向页的关系. 而 rev 属性则指定从目标文档到源文档的关系.百度目前支持: rel='noflow'属性. rel属性的意思是指: 当前页和指向页的关系. < ...

  3. 不要天真了,这些简历HR一看就知道你是培训的,质量不佳的那种

    上到职场干将下到职场萌新,都会接触到包装简历这个词语.当你简历投到心仪的公司,公司内负责求职的工作人员是如何甄别简历的包装程度的?Jason 老师根据自己的经验写下了这篇文章,谁都不是天才,包装无可厚 ...

  4. vs2010编译zapline-zapline.systemoptimization 注释工程中的//#define abs(value) (value >= 0 ? value : -(value))即可

    vs2010编译zapline-zapline.systemoptimization-8428e72c88e0.zip出错 1>d:\program files (x86)\microsoft ...

  5. duilib加消息

    一.加消息 1. public INotifyUI, 2. void Notify(TNotifyUI& msg); 3. Notify实现 4. m_pManager->AddNoti ...

  6. 使用ML-Agents Toolkit(0.5)训练游戏ai之游戏打包

    这篇文章介绍如何训练官方的一个例子3dball. 确保在此之前已经安装好训练环境可以参考下面的文章. https://www.cnblogs.com/pojdd/p/9804322.html 游戏打包 ...

  7. 个人永久性免费-Excel催化剂功能第31波-数量金额分组凑数功能,财务表哥表姐最爱

    在财务工作过程中,很大时候需要使用到凑数的需求,花了两三天时间认真研究了一下,本人水平也只能做代码搬运工,在用户体验上作了一下完善.完成了Excel版的凑数功能. 文章出处说明 原文在简书上发表,再同 ...

  8. idea 警告:Warning:java: 源值1.5已过时, 将在未来所有发行版中删除

    在pom.xml文件中添加 <properties>         <maven.compiler.source>1.8</maven.compiler.source& ...

  9. c语言进阶9-值传递与地址传递

    一.  函数的值传递 函数的值传递是指参数为基本类型时,如整型.浮点型.字符型(特指单字符型)时,参数传递时是从实参拷贝一份值传给形参,形参的变化不会影响实参的值. 1.        基本类型做参数 ...

  10. 《VR入门系列教程》之20---使用Oculus移动端SDK

    使用Oculus移动端SDK     在基于安卓系统的GearVR上开发应用需要用到Oculus的移动端SDK,下面的网址可以下载SDK:http://developer.oculus.com     ...