JS实现点击table中任意元素选中
上项目开发,忙的焦头烂额,博客也没咋更新了。
昨天老师提了个需求,简单的小例子,选择tr中任一行选中tr,觉得很有意思,记录一下:
上代码
<!DOCTYPE html>
<html>
<head>
<title>更新checked</title>
</head>
<script src="E:\java jar\jquery\jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).on("click","#table1 tr td:not(:first-child)",function(){
var obj = $(this).parent().find("td:first").find("input");
obj.prop("checked", !obj.is(":checked"));
})
</script>
<body>
<table id="table1" border="1px">
<tr id="tr1">
<td><input type="checkbox" name="stuId"></td>
<td><p id="stuName" name="stuName">StudentName</p></td>
<td><p id="stuNo" name="stuNo">StudentNo</p></td>
<td><p id="stugrade" name="stugrade">StudentNo</p></td>
</tr>
</table>
</body>
</html>
作用就是选择tr中任意部分,选中此条记录。
JS实现点击table中任意元素选中的更多相关文章
- 点击table中的某一个td,获得这个tr的所有数据
功能: 点击table中的某一个td,获得这个tr的所有数据 效果图 <html> <head> <script> function getData2(elemen ...
- js的传值,table中tr的遍历,js中动态创建数组
1.这里关键是对页面中的传值,其次是动态的创建一个数组,用来存值 $(val).css("background-color", "rgb(251, 248, 233)&q ...
- 【2017-07-03】JS连续删除table中的选中的多行数据
deleteRow() 连续删除多行 应用:删除表格选中的一行或多行.html代码如下: <table > <tr> <td >复选框</td> < ...
- js创建点击事件中<a>标签onclick传递多个参数
var rowIndex = e.rowIndex; var t = "<a href='javascript:void(0)' onclick=\"viewInfo('&q ...
- js穿梭框;将两个table中的数据选中移动
将table中选中的数据移动到右边: 点击一行中的任意一个位置,使其选中: 注:attr()和prop()都是jquery的方法: .attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 ...
- react 使用antd的在图片列表或表格中实现点击其他元素Checkbox选中功能
antd官网上的Checkbox功能只能单独使用,在表格中加入Checkbox也只能点击Checkbox按钮才能实现选中或取消功能 如果我们要实在表格行中点击或在图片列表中点击图片就能实现选中或取消, ...
- Vue. 之 Element获取table中选中的行
Vue. 之 Element获取table中选中的行 问题描述: 如下截图,在Table中选择数据后,然后在点击“统计”按钮,获取Table表中选择的行 解决方案: 1. 给“统计”这个按钮添加一个点 ...
- bootstrap Table 中给某一特定值设置table选中
bootstrap Table 中给某一特定值设置table选中 需求: 如图所示:左边地图人员选定,右边表格相应选中. 功能代码: //表格和图标联动 function changeTableSel ...
- 《项目经验》--后台一般处理程序向前台JS文件传递JSON,JS解析JSON,将数据显示在界面--显示在DropDownList 或 显示在动态创建的table中
http://blog.csdn.net/mazhaojuan/article/details/8599167 先看一下我要实现的功能界面: 这篇文章主要介绍:后台一般处理程序把从数据库查找的数据,转 ...
随机推荐
- ASP.NET Identity系列教程-2【Identity入门】
https://www.cnblogs.com/r01cn/p/5177708.html13 Identity入门 Identity is a new API from Microsoft to ma ...
- P1282 多米诺骨牌【dp】
P1282 多米诺骨牌 提交 20.02k 通过 6.30k 时间限制 1.00s 内存限制 125.00MB 题目提供者洛谷 难度提高+/省选- 历史分数100 提交记录 查看题解 标签 查看算 ...
- Android开发长按菜单上下文菜单
安卓开发中长按弹出菜单的创建方法: 1.首先给View注册上下文菜单registerForContextMenu(); 2.添加上下文菜单内容onCreateContextMenu(): ---可以通 ...
- centos7上python3.6.5的安装及卸载
前言 最近开始安装配置公司给我的台式机,加上刚刚购买的ECS,处女座的我,环境前前后后大概装了有十来次吧,之前装总是临时网上找教程,但是装下来总是感觉有点别扭,当时服务器装的是3.6.5,虚拟机装的是 ...
- .NetCore3.0短网址项目
Wei.TinyUrl 基于.NetCore3.0 + Mysql开发的短网址项目 项目地址:https://github.com/a34546/Wei.TinyUrl 演示效果: 快速开始 1. 修 ...
- 845. 八数码(bfs+map)
在一个3×3的网格中,1~8这8个数字和一个“X”恰好不重不漏地分布在这3×3的网格中. 例如: 1 2 3 X 4 6 7 5 8 在游戏过程中,可以把“X”与其上.下.左.右四个方向之一的数字交换 ...
- C++-POJ3233-Matrix Power Series[矩阵乘法][快速幂]
构造矩阵 #include <cstdio> ; struct Matrix{int a[MAXN][MAXN];}O,I;int N; ;i<MAXN;i++);j<MAXN ...
- java中拦截器与过滤器
注:文摘自网络,仅供自己参考 1.首先要明确什么是拦截器.什么是过滤器 1.1 什么是拦截器: 拦截器,在AOP(Aspect-Oriented Programming)中用于在某个方法或字段被访问之 ...
- pytest-测试用例teardown和setup
setup和teardown对于处理一些前置条件很有帮助 用例运行级别 模块级(setup_moudle/teardown_moudle)开始于模块始末,全局的 所有用例开始前/结束后执行一次(整个. ...
- 【你不知道的javaScript 上卷 笔记6】javaScript中的对象相关内容
一.创建一个对象的语法 var myObj = { key: value // ... };//字面量 var myObj = new Object(); //new myObj.key = valu ...