将从model中获得的数据传到js函数中
刚遇到了一种情况,从controller中获得的model是一个集合,需要将这个集合循环放到标签中,并且需要为这些标签添加点击事件,每个值传入对应的点击事件函数中,由于model中的值是通过${item.user_id} 获取的,通过循环得到的标签的id都是相同的,不能直接通过id获得数据。以下是我想到的方法,不知道还有没有更简单的方法,欢迎回复。
1、由于循环得到的id都是相同的,所以在循环标签中不添加id,在js中动态添加js.
<th:block th:each="item,itemStat : ${wantadopter}" th:if="${itemStat.count}<=5">
<li>
<!-- 帖子操作 post_operation-->
<div class="post_operation">
<div class="operation_button"></div>
<div class="operation_opt">
<div th:switch="${item.adobtStatus}">
<div th:case="0">
<div class="jjly">
<span class="jujue_box" th:value="${item.user_id}" title="发送消息"></span>
</div>
</div>
</div>
</div>
</div>
</li>
</th:block>
2、通过JS获得model的值
$(function () {
const list = [[${wantadopter}]];
var i222 = 0;
$(".jujue_box").each(function () {
var in11 = i222;
$(this).attr('id', "user_" + i222);
i222 += 1;
})
for(var i=0;i<list.length;i++){
$("#user_"+i).click(function (){
//这样就获得了model中的值list[$(this).index()].user_id
console.log(list[$(this).index()].user_id);
//可以直接传到JS方法中进行调用
})
}
}
将从model中获得的数据传到js函数中的更多相关文章
- 【pytest官方文档】解读- 如何自定义mark标记,并将测试用例的数据传递给fixture函数
在之前的分享中,我们知道可以使用yield或者return关键字把fixture函数里的值传递给test函数. 这种方法很实用,比如我在fixture函数里向数据库里插入必要的测试数据,那我就可以把相 ...
- 在JS函数中执行C#中的函数、字段
1.调用字段 cs文件的代码: ; protected void Page_Load(object sender, EventArgs e) { id = ; } js页面的代码: function ...
- 深入理解JS函数中this指针的指向
函数在执行时,会在函数体内部自动生成一个this指针.谁直接调用产生这个this指针的函数,this就指向谁. 怎么理解指向呢,我认为指向就是等于.例如直接在js中输入下面的等式: console.l ...
- js函数中获得当前被点击元素
问题描述:在html页面中点击<a>或者’按钮‘,进入js中的函数,在js函数中获得被点击那个<a>或‘按钮’元素 解决方法:方法一: html中: <a>标签:& ...
- js函数中参数的传递
数据类型 在 javascript 中数据类型可以分为两类: 基本类型值 primitive type,比如Undefined,Null,Boolean,Number,String. 引用类型值,也就 ...
- js函数中的BOM和DOM
BOM 浏览器对象模型 screen对象 console.log(screen.width);// 屏幕宽度 console.log(screen.height);// 屏幕高度 console.l ...
- js函数中this的不同含义
1.js函数调用过程中,js线程会进入新的执行环境并创建该环境的变量对象,并添加两个变量:this和arguments,因此可以在函数中使用这两个变量.需要注意的是,this变量不能重新赋值,而arg ...
- js 函数中的this
资料 function 函数 没有"this"的持久概念, 调用函数时,创建this function hello(thing) { console.log(this + &quo ...
- js函数中写默认值的几种方式(常见的)
<script> <!--第一种写法,我更喜欢第一种写法直观一些--> function Person(name){ this.name = name || '默认名字乔丹'; ...
随机推荐
- Oracal数据库安装配置教程
官网注册账号登录 https://www.oracle.com/technetwork/database/enterprise-edition/downloads/oracle12c-windows- ...
- 记第一次正式线上笔试(Tencent——正式考-技术研发类-综合-2018实习生招聘)
选择题做的跟傻逼一样,不多说了..大学只打了ACM还不是计算机科班出身的我,连好多名词都不认识..... 三道编程题很简单,下面给出三道题的大致题意以及题解. 1.给出n和m,满足(2m)可以整除n. ...
- shell练习--关于二维数组的实现问题
关于二维数组的实现问题:通过查询网友们的记录,可知有两个方法 方法1:通过通过2次读取赋值,来获取二维数组的方法. a=('1 2 3' '4 5 6' '7 8 9') for i in " ...
- Ubuntu ssh秘钥生成
一,秘钥生成传送 ssh-keygen 选项: -b:指定密钥长度: -e:读取openssh的私钥或者公钥文件: -C:添加注释: -f:指定用来保存密钥的文件名: -i:读取未加密的ssh-v2兼 ...
- ASP.NET实现文件断点续传
IE的自带下载功能中没有断点续传功能,要实现断点续传功能,需要用到HTTP协议中鲜为人知的几个响应头和请求头. 一. 两个必要响应头Accept-Ranges.ETag 客户端每次提交下载请求时,服务 ...
- Pku2978 Colored stones
题目链接:Click here Solution: 状压dp,考虑\(f[i][j][k]\)表示当前到了第i个石头,颜色状态为j,选取的最后一个石头颜色为k时能够留下的石头的最大数量 转移也很好转移 ...
- socket模块其他用法
1.socket模块的其他方法 服务端套接字函数 s.bind() 绑定(主机,端口号)到套接字 s.listen() 开始TCP监听 s.accept() 被动接受TCP客户的连接,(阻塞式)等待连 ...
- CVPR 2018 DeepGlobe
在刚刚结束的CVPR2018: DeepGlobe Road Extraction Challenge(全球卫星图像道路提取)比赛中,北京邮电大学信息与通信工程学院模式识别实验室张闯老师指导的研究生周 ...
- C# Cache缓存的应用
缓存类Cache的使用 直接先上代码 public class CacheHelper { private static string fileName = @"D:\huage.txt&q ...
- C# Socket-TCP异步编程原理详解附源码
目录 目录异步原理主要方法源码Server源码:Client源码实验效果(广播为例)参考博客 TOC 异步原理 套接字编程原理:延续文件作用思想,打开-读写-关闭的模式. C/S编程模式如下: Ø 服 ...