通过thymeleaf实现后台集合数据，前端循环显示，并实现点击复制功能

话不多说上干货

后台集合传输

List<String> paramList = new ArrayList<String>();
model.addAttribute("paramList",paramList);
return "页面路径";

前端实现后台代码循环

<table class="layui-table timo-detail-table">
            <col width="150px"><col>
            <tbody>
                <tr th:each="param: ${paramList}">
                    <td th:title="${param}" th:text="${param}" th:onclick="copytext([[${param}]])"></td>
            </tbody>
        </table>

js实现点击复制

<script type="text/javascript">
        function copytext(text) {
            var oInput = document.createElement('input');
            oInput.value = text;
            document.body.appendChild(oInput);
            oInput.onfocus = function(e){
                e.preventDefault()
            }
            oInput.select(); // 选择对象
            document.execCommand('Copy')
            oInput.blur();
            document.body.removeChild(oInput);
            layer.msg("复制成功", {offset: '15px', time: 1000, icon: 1});
        }
    </script>

就搞定了，快来动手试试吧。