s2选择框的全选和反选jQuery
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<input type="button" value="全选" onclick="allSelect()">
<input type="button" value="反选" onclick="reverseSelect()">
<input type="button" value="取消" onclick="deleteSelect()">
</div>
<table border="1">
<thead>
<tr>
<th>选择</th>
<th>ip</th>
<th>post</th>
</tr> </thead>
<tbody id="tb">
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>80</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>80</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>80</td>
</tr> </tbody> </table>
<script src="../jquery-2.12.4.js"></script>
<script>
function allSelect() {
var v=$('#tb input[type="checkbox"]');
console.log(v);
v.prop('checked', true)
}
function deleteSelect() {
var v = $('#tb input[type="checkbox"]');
v.prop('checked', false) }
function reverseSelect() {
$('#tb input[type="checkbox"]').each(function () {
if($(this).prop('checked')){
$(this).prop('checked', false);
}
else{
$(this).prop('checked', true);
}
})
}
</script> </body>
</html>
s2选择框的全选和反选jQuery的更多相关文章
- 纯javascript实现选择框的全选与反选
HTML部分 <div id="wrap_input_box" > <input type="checkbox"><br> ...
- 【jQuery】复选框的全选、反选,推断哪些复选框被选中
本文与<[JavaScript]复选框的全选.反选.推断哪些复选框被选中>(点击打开链接)为姊妹篇,把里面内容再与jQuery框架中实现一次,相同做到例如以下的效果: 布局还是相同的布局, ...
- jQuery实现复选框的全选、反选、并且根据复选框的<checked属性>控制多个对应div的显示/隐藏
<!doctype html><html> <head> <meta charset="utf-8"> <title>j ...
- angular4 checkbox复选框的全选,反选及个别选择
<label><input type="checkbox" name="" [(ngModel)]="master"> ...
- jQuery 实现复选框的全选与反选
<script> //实现全选与反选 $(".allAndNotAll").click(function () { if ($(this).prop("che ...
- jquery简单实现复选框的全选与反选
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 页面的checkbox框的全选与反选
if (typeof jQuery == 'undefined') { alert("请先导入jQuery");} else { jQuery.extend({ ...
- dom实例,模态框,全选,反选,取消
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQuery实现复选框的全选、反选功能
<ul id="list"> <li><label><input type="checkbox" value=&quo ...
随机推荐
- 调试工具-fiddler:本地资源替换线上调试
Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,设置断点,查看所有的“进出”Fiddler的数据(指cookie,html,js,css等文件,这 ...
- Psping 实例
PsPing v2.1 https://docs.microsoft.com/zh-cn/sysinternals/downloads/psping 2016/06/29 4 分钟阅读时长 By Ma ...
- 模板方法模式templeteMethod
引出模板模式: 考试试卷问题,提炼后的代码: package com.disign.templetemethod; import org.junit.Test; /** * Created by zh ...
- 201621123010《Java程序设计》第7周学习总结
1. 本周学习总结 1.1思维导图:Java图形界面总结 2.书面作业 1. GUI中的事件处理 1.1 写出事件处理模型中最重要的几个关键词. addActionListener(new Actio ...
- 一起玩转mysql
mysql安装 一起玩转mysql linux命令
- IOS layoutSubviews总结
ios layout机制相关方法 - (CGSize)sizeThatFits:(CGSize)size - (void)sizeToFit - (void)layoutSubviews - (voi ...
- Swift 获取plist文件展示在TableView上
// 1.定义二维数组 var data:[[String]]! override func viewDidLoad() { super.viewDidLoad() // 2.实例化tableView ...
- 回测框架pybacktest简介(二)
pybacktest 的疑点 第(一)节“教程”原文,是用 ipython notebook 写成,程序代码是一些片段组成. 为了阅读方便,合并在一起. 本文转载于:http://blog.csdn. ...
- I.MX6 PWM buzzer driver hacking with Demo test
/***************************************************************************** * I.MX6 PWM buzzer dr ...
- 每天一个linux命令(网络):【转载】route命令
Linux系统的route命令用于显示和操作IP路由表(show / manipulate the IP routing table).要实现两个不同的子网之间的通信,需要一台连接两个网络的路由器,或 ...