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 先看一下我要实现的功能界面: 这篇文章主要介绍:后台一般处理程序把从数据库查找的数据,转 ...
随机推荐
- .net mvc 使用 aspose.cells导出数据
public class AsposeCellsHelper { public Workbook workBook; public Worksheet worksheet; Style style; ...
- 今天才知道a标签的href="#"是回到页面顶部
如题,真的是,做了一年多的开发,今天才知道a标签的href="#"是回到顶部.以前一直以为这是个多么了不起的功能. 顺便扩展一下滑动隐藏和显示按钮(从别处拷贝来的代码) $( do ...
- ubuntu18.04图形模式切换到命令模式
命令模式 :Ctrl+Alt+F5 图形模式:Ctrl+Alt+F1
- PGET,一个简单、易用的并行获取数据框架
使用场景 当我们的服务收到一个请求后,需要大量调用下游服务获取业务数据,然后对数据进行转换.计算后,响应给请求方. 如果我们采用串行获取下游数据,势必会增加响应时长,降低接口的qps.如果是并行获取下 ...
- POJ3723(最小生成树,负权)
题目描述 温迪有一个国家,他想建立一支军队来保护他的国家.他收留了N个女孩和M个男孩,想把她们收留成他的士兵.征兵无特权,必须交纳一万元.女孩和男孩之间有一些关系,温迪可以利用这些关系来降低他的成本. ...
- Longest Ordered Subsequence POJ - 2533 dp 最长上升/不下降 子序列
#include<iostream> using namespace std ; ; int f[N]; int a[N]; int n; int main() { cin>> ...
- IOU 选框和真实框重叠部分占两个总框并集的比例
IOU 选框和真实框重叠部分占两个总框并集的比例 IOU 召回率:表示在预测为的正类中,有多少正类被预测为正类 https://blog.csdn.net/qq_36653505/article/de ...
- 我的python笔记06
面向对象学习 本节内容: 面向对象编程介绍 为什么要用面向对象进行开发? 面向对象的特性:封装.继承.多态 类.方法. 引子 你现在是一家游戏公司的开发人员,现在需要你开发一款叫做< ...
- const真有点烦
在C++中const代替#define的操作,当定义一个const时必须附一个值给它:const int size = 100;通常C++编译器不为const创建存储空间,相反它把这个定义保存在符号表 ...
- 【vue】 vue跳转页面:router-link/this.$router.push()
1.通过标签<router-link> <router-link to='A'>跳转到A页面</router-link> 2.通过方法 this.$router.p ...