jquery全选,全不选,反选
前台
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Smarty分页程序</title>
<style type='text/css'>
.news{width:800px;border:1px #369 solid; border-collapse:collapse;}
.news tr th,.news tr td {border:1px #369 solid; text-align:center;line-height:30px; font-size:12px;}
</style>
<script type='text/javascript' src='jquery.js'></script>
<script>
$(function(){
/***********全选,全不选,反选************/
$('#abc').click(function(){
if($(this).prop('checked')){
$('table input[type=checkbox]').prop('checked',true); }else{
$('table input[type=checkbox]').prop('checked',false);
}
}); $('#bcd').click(function(){
$('table input[type=checkbox]').each(function(){
if ($(this).prop("checked")) {
$(this).prop("checked", false);
}else {
$(this).prop("checked", "checked");
}
});
});
/***********全选,全不选,反选************/
})
</script>
</head>
<body>
<h1>Smarty分页程序</h1>
全选:<input id='abc' type="checkbox">
反选:<input id='bcd' type="checkbox">
<input type="button" value="删除">
<table class='news'>
<tr>
<th>操作:
</th>
<th>编号</th>
<th>姓名</th>
<th>内容</th>
<th>发布时间</th>
</tr>
{{foreach from = $data item=v key=k}}
<tr>
<td><input type="checkbox"></td>
<td>{{$v['id']}}</td>
<td>{{$v['username']}}</td>
<td>{{$v['content']}}</td>
<td>{{$v['addtime']}}</td>
</tr>
{{/foreach}}
<tr>
<td colspan="5">
<input type='button' id='btnFirst' value='首页'>
<input type='button' id='btnPrev' value='上一页'>
<a href='fenye.php?page={$pageNext}'>下一页</a>
<a href='fenye.php?page={$pageCount}'>末页</a>
</td>
</tr>
</table>
</body>
</html>
jquery全选,全不选,反选的更多相关文章
- 利用jQuery实现CheckBox全选/全不选/反选
转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...
- jquery的全选/全不选/反选以及attr添加checked属性失败的解决办法
如下图: <head> <title></title> <style type="text/css"> div { border: ...
- jQuery实现的全选、反选和不选功能
适用于网页多选后需要进行批量操作的场景(如批量删除等).如有问题希望大家可以指正.谢谢~~ HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮 ...
- 用jQuery实现全选-全不选-反选的功能
临近过年,刚学IT没多久的小白在这里祝大家在新的一年里:新春快乐,月月赚钱,天天开心,时时快乐,分分精彩,秒秒幸福,事事顺利 古人云:学而时习之,不亦说乎. 学习后经常温习所学的知识,也是件令人愉悦的 ...
- jQuery实现全选、不选和反选功能
jQuery结合Font Awesome字体图标实现全选.不选和反选功能 Font Awesome字体图标链接地址:http://www.fontawesome.com.cn/faicons/ 效果: ...
- jquery实现全选、不选、反选的两种方法
在取复选框checkbox的属性checked属性值时,发现一个问题,就是当用attr取值时,真的为"checked",假的为"undefined";当用pro ...
- jQuery实现的全选、反选和获取当前所有选中的值功能
链接: jQuery实现的全选.反选和获取当前所有选中的值功能 <ul id="list"> <li><label><input type ...
- Java 多选框的全选、多选、反选(JQuery 实现)
jQuery 实现全选.多选.反选 学习内容: 需求 总结: 学习内容: 需求 jQuery 实现全选.多选.反选 实现代码 <!DOCTYPE html> <html lang=& ...
- jquery 全选 全不选 反选
1.概述 在项目中经常遇到列表中对复选框进行勾选操作,全选...反选.. 2. example <html> <body> <form id="test-for ...
- jQuery实现checkbox全选反选及删除等操作
1.list.html 说明:用checkbox数组Check[]存放每一行的ID值 <div id="con"> <table width="100% ...
随机推荐
- 牛客网PAT-练兵场-挖掘机技术哪家强
题目地址:https://www.nowcoder.com/pat/6/problem/4058 题解:用数组下标当学校编号.输入一次数据的时候,直接在相应数组下标位置累加内容,同时更新最大的总分的学 ...
- muduo源码解析8-date类
date class date:copyable { }: 作用: 此类作用主要是实现年月日和julianDay的互相转换内部最重要的一个数据成员m_julianDayNumber在mymuduo:: ...
- 区块链入门到实战(36)之Solidity – 运算符
Solidity – 算术运算符 Solidity 支持的算术运算符,如下表所示: 假设变量A的值为10,变量B的值为20. 序号 运算符与描述 1 + (加)求和例: A + B = 30 2 – ...
- 作为一个Java程序员连简单的分页功能都会写,你好意思嘛!
今天想说的就是能够在我们操作数据库的时候更简单的更高效的实现,现成的CRUD接口直接调用,方便快捷,不用再写复杂的sql,带吗简单易懂,话不多说上方法 1.Utils.java工具类中的方法 1 /* ...
- Linux bpytop工具介绍
一.工具简介: Easy to use, with a game inspired menu system. Full mouse support, all buttons with a highli ...
- Entity Framework 6 实体某些字段根据模型状态进行自动更新内容
1.定义基础实体对象 public class BaseEntity { public int Id { get; set; } public DateTime? CreateTime { get; ...
- 全局api 2020/8/14
// 注意:每次调用 $.get() 或 $.post() 或 $.ajax() 的时候, // 会先调用 ajaxPrefilter 这个函数 // 在这个函数中,可以拿到我们给Ajax提供的配置对 ...
- row_number()分页返回结果顺序不确定
之前通过row_number()实现分页查询时: select top [PageSize] * from ( select row_number() over (order by id desc) ...
- 无法登陆网站,nginx漏配置
location / { try_files $uri $uri/ /index.php?$query_string; } 这条主要是将index.php入口文件重写掉,所以平常我 ...
- AndroidStudio中利用git下载github或者git.oschina的代码时报错:repository test has failed解决方法
作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985 QQ986945193 微博:http://weibo.com/mcxiaobing AndroidS ...