1、如果想让table具有可以编辑的功能,可以在table里嵌入input标签
写法{{ list_one[1] or ‘‘ }}的作用是,当list_one[1]取值为None时,前端web界面不至于显示None,而是显示为空
<table class="table table-bordered" id="parameters"> ??????<tr> ???????????<th style="width: 5px">变量名称</th> ???????????<th>变量值</th> ??????</tr> ???????{% for list_one in info_list[8] %} ??????<tr> ????????????<td>{{ list_one[0] }}</td> ????????????<td><input class="form-control" placeholder="必填" value="{{ list_one[1] or ‘‘ }}"></td> ??????????</tr> ??????{% endfor %}</table>
2、js如何获取这些值,并把他们传给flask后台呢?
下列方法可以获得table的各行各列的值。
JSON.stringify(parameters)把参数json话
$("#save_script").click(function () { ???????var parameters = new Array(); ???????rows = document.getElementById("dubbo_parameters").rows; ???????for(var row=1;row<rows.length;row++){ ???????????parameters[row-1] = new Array(); ???????????for(var col=0;col<rows[row].cells.length;col++){ ???????????????if(col%2 == 0){ ???????????????????parameters[row-1][col] = rows[row].cells[col].innerHTML; ???????????????}else { ???????????????????parameters[row-1][col] = rows[row].cells[col].childNodes[0].value; ?获取td里input的value值 ???????????????} ???????????} ???????} ???????$("#dubbo_para").val(JSON.stringify(parameters)); ???????});
3、后台如何获得前端传过来的值
使用flask的json.load方法,可以把前端传过来的字符串变为python的list
dubbo_para = json.loads(request.form.get("dubbo_para"))
4、jquery方式
<table> ??<tr> ???????<td><input type="text" value="外出"></td> ??</tr></table>jquery:$("table tr").children("td:eq(0)").find("input").val(); ???
参考:
1、https://segmentfault.com/a/1190000007605055
2、https://blog.csdn.net/xuliangwen/article/details/6932064
js获取table的值,js获取td里input的值
原文地址:https://www.cnblogs.com/shengulong/p/8919747.html