今天写了个小功能,模仿radio单选,

//单选收货地址
$(".wuliu-table-to").find(".called").click(function(){
if($(this).hasClass("unCalled")){
$(this).removeClass("unCalled").addClass("onCalled");
$(this).parents("tr").siblings().find(".called").removeClass("onCalled").addClass("unCalled")
}else{
$(this).removeClass("onCalled").addClass("unCalled");
} });
.wl-called {text-align:center;}
.wl-called a{width:16px; height:16px; margin:0 10px; display:inline-block;}
.wl-called a img{display:block;width:16px; height:16px; vertical-align:top;}
.wl-called .called{ background:url(../images/called.png) no-repeat;}
.wl-called .unCalled{ background-position:-16px top;}
.wl-called .onCalled{background-position:left top;}
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table wuliu-table-to">
<colgroup>
<col class="col-xs-3">
<col class="col-xs-3">
<col class="col-xs-2">
<col class="col-xs-2">
<col class="col-xs-2">
</colgroup>
<tr>
<th scope="col">收货地址</th>
<th scope="col">详细地址</th>
<th scope="col">收货联系人</th>
<th scope="col">联系人手机</th>
<th scope="col">操作</th>
</tr>
<tr>
<td>上海市普陀区</td>
<td>***路***号306室</td>
<td>赵美丽</td>
<td>188666888</td>
<td class="wl-called clearfix">
<a href="javascript:void(0)" class="" title="编辑" data-toggle="modal" data-target="#edit"><img src="data:images/edit.png"></a>
<a href="javascript:void(0)" class="" title="删除" data-toggle="modal" data-target="#delete"><img src="data:images/delete.png"></a>
<a href="javascript:void(0)" class="called onCalled" title="重置密码"></a>
</td>
</tr>
<tr>
<td>上海市普陀区</td>
<td>***路***号306室</td>
<td>赵美丽</td>
<td>188666888</td>
<td class="wl-called clearfix">
<a href="javascript:void(0)" class="" title="编辑" data-toggle="modal" data-target="#edit"><img src="data:images/edit.png"></a>
<a href="javascript:void(0)" class="" title="删除" data-toggle="modal" data-target="#delete"><img src="data:images/delete.png"></a>
<a href="javascript:void(0)" class="called unCalled" title="重置密码"></a>
</td>
</tr>
<tr>
<td>上海市普陀区</td>
<td>***路***号306室</td>
<td>赵美丽</td>
<td>188666888</td>
<td class="wl-called clearfix">
<a href="javascript:void(0)" class="" title="编辑" data-toggle="modal" data-target="#edit"><img src="data:images/edit.png"></a>
<a href="javascript:void(0)" class="" title="删除" data-toggle="modal" data-target="#delete"><img src="data:images/delete.png"></a>
<a href="javascript:void(0)" class="called unCalled" title="重置密码"></a>
</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

[jquery]模仿radio单项选择的更多相关文章

  1. jQuery获取Radio选择的Value值||两个select之间option的互相添加操作(jquery实现)

    jQuery获取Radio选择的Value值: 1. $("input[name='radio_name'][checked]").val();  //选择被选中Radio的Val ...

  2. 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传

    使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址  ...

  3. 《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结

    <form> <input type="radio" name="gender" id="man" value=" ...

  4. 【转】jQuery获取Select option 选择的Text和Value

    获取一组radio被选中项的值:var item = $('input[name=items][checked]').val();获取select被选中项的文本:var item = $(" ...

  5. Jquery常用radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置

    获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); 获取select被选中项的文本:var item = $(" ...

  6. jquery 获取Select option 选择的Text和Value

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置 获取一组radio被选中项的值:var item = $(' ...

  7. jQuery选择器的优化选择

    jQuery选择器的优化选择 1.1 属性选择器 var $div=$("[id]"); 选中拥有该属性的元素 var $div=$("[id=div]");  ...

  8. JQuery基础教程:选择元素(中)

    自定义选择符 JQuery在各种CSS选择符的基础上还添加了独有的完全不同的自定义选择符,注意,只要可能,jQuery就会使用浏览器原生的DOM选择符引擎去查找元素.但在使用自定义选择符的时候,就无法 ...

  9. 利用jquery操作Radio方法小结

    用Radio来实现用户的选择效果,在项目中积累了一些利用JQUERY来操作Radio的方法,这里与大家分享下 在开发中经常会用到Radio来实现用户的选择效果,我在项目中积累了一些利用JQUERY来操 ...

随机推荐

  1. WPF绘制简单常用的Path

    写代码出身的我们经常需要使用一些简单 但是不是规则图形的Path 但限于美工功底有限 不知道怎么去画 下面我告诉大家一些简单的小技巧 用代码来画Path 个人还是比较喜欢用代码 因为数值控制的更精细 ...

  2. ionic angularJS input 相关指令 以及定时器 的使用

      <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" conte ...

  3. C#、ASP.NET获取当前应用程序的绝对路径,获取程序工作路径 (转帖)

    C#.ASP.NET获取当前应用程序的绝对路径,获取程序工作路径   ============================================ 使用 Application.Start ...

  4. HIbernate的property-ref属性

    为公司之前的一个公交卡系统修改bug: 通过排查发现, 卡类型表和卡等级表是一对多的关系, 但是卡等级表中没有字段引用卡类型表的主键,而是引用了卡类型表中非主键的另外两个字段 通过查看hibernat ...

  5. 前台checkbox复选框提交到后台处理

    前台 <input type="hidden" id="tempString" name="tempString" /> < ...

  6. 自创yum源

    这里我们用U盘装完系统以后,我们要是使用yum命令的话,我们是装不上包的 这个时候我们装系统的时候 [root@kz-002 Packages]# df -h Filesystem Size Used ...

  7. 使用powershell链接到Azure

    一:针对传统的的Azure 的登陆界面: (ASM) 1. 正常来说是 现在本地创建证书文件,然后上传文件,以便本地计算机和Azure建立可靠的安全连接 Get-AzurePublishSetting ...

  8. Hadoop---Google MapReduce(转)

    1. MapReduce是干啥的 因为没找到谷歌的示意图,所以我想借用一张Hadoop项目的结构图来说明下MapReduce所处的位置,如下图. Hadoop实际上就是谷歌三宝的开源实现,Hadoop ...

  9. web框架 之 Tornado

    初识 Tornado : tornado web server 是使用python编写出来的一个轻量级.高可伸缩性和非阻塞IO的Web服务器软件,其特点是采用epoll非阻塞IO,相应快速,可处理数千 ...

  10. <<< html图片背景平铺

    CSS背景图片平铺技巧 使用CSS来设置背景图片同传统的做法一样简单,但相对于传统控制方式,CSS提供了更多的可控选项,我们先来看看最基本的设置图片的方法.html代码: 代码如下: <divi ...