JQuery点击行tr实现checkBox选中的简单实例
$(function () { //除了表头(第一行)以外所有的行添加click事件. $("tr").first().nextAll().click(function () { //为点击的这一行切换样式bgRed里的代码:background-color:#FF0000; $(this).children().toggleClass("bgRed"); //判断td标记的背景颜色和body的背景颜色是否相同; if ($(this).children().css("background-color") != $(document.body).css("background-color")) { //如果相同,CheckBox.checked=true; $(this).children().first().children().attr("checked", true); } else { //如果不同,CheckBox.checked=false; $(this).children().first().children().attr("checked", false); } }); });
以上这篇JQuery点击行tr实现checkBox选中的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
浅谈jquery设置和获得checkbox选中的问题
1. 设置checkbox选中: //选中多选框 checkbox=$("#agentinfo input[name='veri[]']"); //循环多选框中的值 checkbox.each(function(){ for(var j=0;j<data.veri.length;j++){ //判断当前值是否在数组中 if($(this).val() == data.veri[j]){ $(this).attr('checked','checked');//选中 } } });
-
jQuery实现点击行选中或取消CheckBox的方法
本文实例讲述了jQuery实现点击行选中或取消CheckBox的方法.分享给大家供大家参考,具体如下: /// <summary> /// 点击行选中或者取消CheckBox /// </summary> /// <param name="TableID">表ID</param> function SetCheckBox_Check(TableID) { var $TableID = TableID == "" ? &
-
jquery判断checkbox是否选中及改变checkbox状态的实现方法
jquery判断checked的三种方法: .attr('checked): //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或false .prop('checked'): //16+:true/false .is(':checked'): //所有版本:true/false//别忘记冒号哦 jquery赋值checked的几种写法: 所有的jquery版本都可以这样赋值: // $("#cb1&qu
-
jQuery判断checkbox选中状态
前言 神奇的JQuery怎么设置checkbox状态时好时坏?明明同一行代码,断点跟踪确实执行了,但是有时候好使,有时候却没有生效.毕竟对JS不是很熟悉,只是通过JS来处理前端HTML的标签的状态设置时,通过JQuery有时候会更方便些的,但是发现更不好办. 今天尝试实现checkbox全选.全不选功能,与App开发中的效果是一样的,勾选全选则将所有的选项都选中:同样取消勾选某个子项也将全选设置为非选中状态:所有子选项都为选中状态时,将全选设置为选中状态. 由于对JS不是很熟悉,于是尝试各种百度
-
jQuery获取checkbox选中的值
1.问题背景 有几个多选框,选择其中的几个,获取选中的值 2.设计结果如下图所示: 3.设计源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
-
使用jQuery+EasyUI实现CheckBoxTree的级联选中特效
需求:子结点选中,父节点随之选中,父节点取消,子节点随之取消 代码: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> &
-
jquery获取所有选中的checkbox实现代码
获取所有name为spCodeId的checkbox var spCodesTemp = ""; $('input:checkbox[name=spCodeId]:checked').each(function(i){ if(0==i){ spCodesTemp = $(this).val(); }else{ spCodesTemp += (","+$(this).val()); } }); $("#txt_spCodes").val(spCod
-
JQuery点击行tr实现checkBox选中的简单实例
$(function () { //除了表头(第一行)以外所有的行添加click事件. $("tr").first().nextAll().click(function () { //为点击的这一行切换样式bgRed里的代码:background-color:#FF0000; $(this).children().toggleClass("bgRed"); //判断td标记的背景颜色和body的背景颜色是否相同; if ($(this).children().css
-
JS获取checkbox的个数简单实例
JS获取多选框checkbox被选中的个数. var checkbox = document.getElementsByName("likes[]"); //此处通过此种方式才能获得多选框为数组. //like为name = "like[]" , 获得时必须加上[] var checked_counts = 0; for(var i=0;i<checkbox.length;i++){ if(checkbox[i].checked){ //被选中的checkbo
-
js中获取 table节点各tr及td的内容简单实例
<table id="tb1" width="200" border="1" cellpadding="4" cellspacing="0"> <tr> <td height="25">第一行</td> </tr> <tr> <td height="25">第二行</td>
-
jquery 判断selection range 是否在容器中的简单实例
判断当前选中区域是否在某个父容器中得方法: var range = document.getSelection().getRangeAt(0); if($(range.startContainer).parents("XXXX").length >0) { 在XXX 容器中 } 以上这篇jquery 判断selection range 是否在容器中的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例 document.oncontextmenu = function(){return false}; //禁止鼠标右键菜单显示 var res = document.getElementById('box'); //找到id为box的div document.body.onmouseup = function(e){ //在body里点击触发事件 if(e.button===2){ //如果button=1(鼠标左键),butto
-
jQuery实现手机版页面翻页效果的简单实例
如下所示: var page = 1; var size = 6; var mark = 0; var url = "{pigcms{:U('Order/index', array('page'=>'d%'))}"; var commentTpl = '<div style="margin-top: 10px">\ <button data-oid="<order_id>" style="width:
-
jquery获取form表单input元素值的简单实例
一般取值方法 $("#id").val(); $("#id").attr("value"); //其中value是元素的属性名如<s:textfield id="cifName" key="cifName" name="#request.consBean.cifName" />的id,key,name属性.取到的值是属性后对应双引号里面的字符. function sav
-
jQuery ajax中使用confirm,确认是否删除的简单实例
jQuery ajax 中使用confirm ,确认是否删除按钮 onclick="return confirm('确认删除?');" <script type="text/javascript"> $(function(){ $("#btnDelete").click(function(){ //var user8ID = $.trim( $('#user8ID').val() ); var statu = confirm(&quo
-
jquery mobile 实现自定义confirm确认框效果的简单实例
类似删除的效果,在执行之前,一般需要添加确认对话框,点确认的话执行,取消按钮就不执行,传统的js if(confirm('确定删除吗?')) { //执行代码 } 这种效果比较丑,使用jquery mobile优化一下 需要引用的文件: <script src="~/Scripts/jquery-1.10.2.min.js"></script> <link href="~/Scripts/Mobile/jquery.mobile-1.4.0.mi
-
jQuery点击tr实现checkbox选中的方法
标题描述的有点不贴切,但希望大家能够明白,为了更形像的表达,我特意录制了一张GIF动画图片. 我不知道实际开发中有没有用到这种效果,但我个人认为,这种方式更人性化,因为只要点到一行,就可以使CheckBox.checked=true: 不用非得点复选按钮才能实现; 实现的过程有点纠结,试了几次都没成,最后用了一个笨笨的方法,就是点击行的时候,让他的子元素(td)的背景颜色为红色.(因为我用到了光棒效果,如果我点击行(td)的时候,颜色是变了,但鼠标一离开的时候就又变回原来的颜色了) 可能你会问我
随机推荐
- 在线FLV播放器实现方法
- 百度关键字搜索(批处理打开网页)
- Tomcat 部署程序方法步骤
- PHP6 先修班 JSON实例代码
- Zend Framework教程之Zend_Db_Table_Row用法实例分析
- 在Django的视图(View)外使用Session的方法
- asp下循环一行多少个
- c# xml API操作的小例子
- android上的一个网络接口和图片缓存框架enif简析
- 微信和qq时间格式模板实例详解
- vue仿淘宝订单状态的tab切换效果
- echo(),print(),print_r()之间的区别?
- nodejs 图解express+supervisor+ejs的用法(推荐)
- python实现12306火车票查询器
- jQuery实现的向下图文信息滚动效果
- Java中基于Aspectwerkz的AOP
- JSP教程(七)-pluginAction的使用
- Python实现抓取网页并且解析的实例
- 点击标签切换和自动切换DIV选项卡
- C#中数据的传递以及ToolStripProgressBar