[jquery]模仿radio单项选择
今天写了个小功能,模仿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> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
[jquery]模仿radio单项选择的更多相关文章
- jQuery获取Radio选择的Value值||两个select之间option的互相添加操作(jquery实现)
jQuery获取Radio选择的Value值: 1. $("input[name='radio_name'][checked]").val(); //选择被选中Radio的Val ...
- 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传
使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址 ...
- 《jQuery判断radio、checkbox、select 是否选中和设置选中问题以及获取选中值》总结
<form> <input type="radio" name="gender" id="man" value=" ...
- 【转】jQuery获取Select option 选择的Text和Value
获取一组radio被选中项的值:var item = $('input[name=items][checked]').val();获取select被选中项的文本:var item = $(" ...
- Jquery常用radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置
获取一组radio被选中项的值:var item = $('input[name=items][checked]').val(); 获取select被选中项的文本:var item = $(" ...
- jquery 获取Select option 选择的Text和Value
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关设置 获取一组radio被选中项的值:var item = $(' ...
- jQuery选择器的优化选择
jQuery选择器的优化选择 1.1 属性选择器 var $div=$("[id]"); 选中拥有该属性的元素 var $div=$("[id=div]"); ...
- JQuery基础教程:选择元素(中)
自定义选择符 JQuery在各种CSS选择符的基础上还添加了独有的完全不同的自定义选择符,注意,只要可能,jQuery就会使用浏览器原生的DOM选择符引擎去查找元素.但在使用自定义选择符的时候,就无法 ...
- 利用jquery操作Radio方法小结
用Radio来实现用户的选择效果,在项目中积累了一些利用JQUERY来操作Radio的方法,这里与大家分享下 在开发中经常会用到Radio来实现用户的选择效果,我在项目中积累了一些利用JQUERY来操 ...
随机推荐
- JS组件系列——使用HTML标签的data属性初始化JS组件
前言:最近使用bootstrap组件的时候发现一个易用性问题,很多简单的组件初始化都需要在JS里面写很多的初始化代码,比如一个简单的select标签,因为仅仅只是需要从后台获取数据填充到option里 ...
- SQL 语句大全(转载)
经典SQL语句大全 一.基础 1.说明:创建数据库CREATE DATABASE database-name 2.说明:删除数据库drop database dbname3.说明:备份sql serv ...
- 使用css3 实现太阳升起落下效果
<!DOCTYPE html><html style="overflow: hidden"><head> <meta http-equiv ...
- jsp通过session传递checkbox中的值
获取checkbox中的值(第一个页面) <% String foodName[]=request.getParameterValues("chioce"); //“chio ...
- bzoj 1014 splay维护hash值
被后缀三人组虐了一下午,写道水题愉悦身心. 题很裸,求lcq时二分下答案就行了,写的不优美会被卡时. (写题时精神恍惚,不知不觉写了快两百行...竟然调都没调就A了...我还是继续看后缀自动机吧... ...
- K米点歌APP评测
K米APP评测 产品简介 K米点歌是一款免费的社交K歌手机应用,其手机点歌功能主要在KTV.夜总会,酒吧等K歌场所中使用,当前提供iPhone版本及安卓版本下载使用.——百度百科 评测版本 K米点歌4 ...
- Git------Win7系统使用TortoiseGit
转载: https://my.oschina.net/longxuu/blog/141699?p=1 此步可以省略 1.点击TortoiseGit->PuTTygen 2.点击"Gen ...
- ssh模仿ansible批量执行命令的功能
#!/bin/bash ssh_hosts=("IP" "IP1".......) user=root remote_cmd="df -h" ...
- yield和send的执行循序彻底搞清
yield: 对于yield方法和Generator的send同时使用时的执行顺序一直搞不清,今天看到这篇 理解PHP中的Generator 加上测试,终于搞清了. 总结一下上文中的结论: Gener ...
- 深入理解javascript原型和闭包(1)——一切都是对象
“一切都是对象”这句话的重点在于如何去理解“对象”这个概念. ——当然,也不是所有的都是对象,值类型就不是对象. 首先咱们还是先看看javascript中一个常用的函数——typeof().typeo ...