这是一个创建于 2202 天前的主题，其中的信息可能已经有所发展或是发生改变。
每个 input 往后端传值，大概十个 input 一组，不确定多少组，组的数量可以动态改变，我用 js 加了一大段 html 然后还往里面拼接 id，这个 js 好长，你们平时做也是这样吗？我还有类似需求，感觉页面好丑，以前没见过我这样写的，主要是间的少，这样写好吗，网上也找不到例子，只知道这样做能行，但是感觉不好，有啥我不知道的方法吗
 | 1 yokyj 2019-10-15 09:50:16 +08:00  1 用 react 或者 vue..数据驱动 |
 | 2 imdong 2019-10-15 09:50:46 +08:00 1 ``` <script type="text/html" id="tpl-demo1"> <div>Test<span class="red">Success</span></div> </script> <script> var html_str = document.getElementById('tpl-demo1').innerHTML; </script> ``` |
 | 3 jeodeng 2019-10-15 09:50:55 +08:00 1 唤起了我以前写原生的时候记忆，封装一个插入 input 的函数，需要 n 组就循环 n 次调用函数就直接操作 dom 了。 |
 | 4 hewelzei 2019-10-15 09:55:07 +08:00 1 试试 lodash.template 或者 art-template 之类可以在前端直接引入的模版库，这样可能写的时候舒服一些 |
 | 5 fancy111 2019-10-15 09:58:53 +08:00 1 很明显你没搞清楚业务的最佳处理方式。 十个 input 一组？不确定有多少组？这么多数据干嘛不动态添加转 json 传，搞那么多 input 有必要吗？ |
 | 6 1 不用 react 啥的，就用个 template 吧，js 循环添加 |
 | 7 ChefIsAwesome 2019-10-15 10:04:00 +08:00 2 |
 | 8 xiaobo944 2019-10-15 10:42:10 +08:00 1 不光是这些麻烦问题，以后还会遇到绑定事件的问题， 重复绑定，触发了两次之类的。 还有元素是否创建出来，能不能绑定事件。 或者元素未生成之前你的值是获取不到的。 我早先也经常创建删除 HTML 遇到了不少问题，还尝试自定义模板字符，将字符串替换，执行函数什么的用 eval 去跑，太麻烦了，到了后边改动很麻烦。 直接输出 HTML 的做法 demo 项目还可以，如果正常开发，请移步现代前端开发技术选型 react Vue 之类的。 |
 | 9 tyx1703 2019-10-15 11:00:39 +08:00 1 可以看看 Mustache |
 | 10 ironMan1995 2019-10-15 11:22:07 +08:00 比如要给后端传递 const data = {inputValOne: '',inputValTwo: ''} ，先写个 input 的组件，给它定义一个自定义属性 data-*(名字就是要传给后端的数据属性名)，const keys = Object.keys(data)，直接循环 keys 遍历 input 组件，所有组件监听一个 onChange 事件,通过 const name = event.currentTarget.getAttribute(‘data-*’) 获取自定义名称，data[name] = ev.target.value，最后 JSON.stringify(data),传给后端就行，这是我的思路 |
| 11 ironMan1995 2019-10-15 11:25:52 +08:00 循环一个组件或者模板动态渲染出来，最后直接插入到页面，操作 dom 次数也少 |
 | 12 12tall 2019-10-15 11:28:47 +08:00 vue? 时间紧 能跑起来就是好代码~ |
 | 13 LyleRockkk 2019-10-15 11:32:53 +08:00 找个前端朋友帮你解决这个问题吧，如果非要自己来，可以了解一下 template 模板语法，vue ,react 上手可能会慢一些 |
Select Language