效果如图:

js动态的往表格中加入表单元素

   这里我用的是layui的静态表格,其他框架也是一样的(只要你都表单元素要通过js进行渲染),我的需求是在表单中放了表格的元素,表格中还有表单的元素。表格中的行数据是js动态添加的,正常的添加直接拼接进去就可以了效果就能出来,因为我是放到表单里边的,所以最后还要在js代码后边引入一次form表单的渲染;奇怪的渲染之后还没有生效,想了一下应该是在表单进行渲染的时候js还没有去添加行数据,所以没有渲染到,然后手动渲染了一下。果然,效果出来了。

  

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="layui/css/layui.css" />
		<script src="js/jquery-3.3.1.js"></script>
		<script type="application/javascript" src="layui/layui.js"></script>
	</head>

	<body>
		<form class="layui-form">
			<div>
				<table >
				  <colgroup>
				    <col width="150">
				    <col width="200">
				    <col>
				  </colgroup>
				  <thead>
				    <tr>
				      <th>昵称</th>
				      <th>加入时间</th>
				      <th>签名</th>
				    </tr> 
				  </thead>
				  <tbody >
					
				  </tbody>
				</table>
			</div>
			
		</form>
		
	</body>
	<script>
		//如果这里的数据是通过后台传过来的,记得手动渲染下
		var index = 1;
		$('#info').append("<tr );
		layui.use('form',function () {
			var form = layui.form;
                //手动渲染
              form.render();
}) </script> </html>

  

相关文章:

  • 2022-12-23
  • 2021-06-09
  • 2022-12-23
  • 2021-07-01
  • 2022-01-16
  • 2021-12-24
  • 2021-11-19
  • 2021-09-12
猜你喜欢
  • 2022-02-09
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-01-26
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案