js：for循环ul/li，获取当前被点击元素的id，以及给其他li设置属性

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>选择框样式</title>

<script src="jquery.min.js"></script>

<style>

/*label {font-size:12px;cursor:pointer;}  */

label i {font-size:12px;font-style:normal;display:inline-block;width:12px;height:12px;text-align:center;line-height:12px;color:#fff;vertical-align:middle;margin:-2px 2px 1px 0px;border:#2489c5 1px solid;}

/*input[type="checkbox"],*/input[type="radio"] {display:none;}

/*input[type="radio"] + i {border-radius:7px;}  */

/*input[type="checkbox"]:checked + i,*/input[type="radio"]:checked + i {background:#2489c5;}

/*input[type="checkbox"]:disabled + i,*/input[type="radio"]:disabled + i {border-color:#ccc;}

/*input[type="checkbox"]:checked:disabled + i,*/input[type="radio"]:checked:disabled + i {background:#ccc;}  

</style>

</head>

<body>  

<!--

<label><input type="checkbox"><i>✓</i>复选框</label><br>

<label><input type="checkbox" checked><i>✓</i>复选框</label><br>

<label><input type="checkbox" disabled><i>✓</i>复选框禁用</label><br>

<label><input type="checkbox" disabled checked><i>✓</i>复选框禁用已选</label><br>

-->

<label><input type="radio" name="abc" disabled><i>✓</i>单选框禁用</label><br>

<label><input type="radio" name="def" disabled checked><i>✓</i>单选框禁用已选</label><br>  

<ul class="table-view">

	<li class="table-view-cell ">

	<label class="radioboxCheck"><input type="radio" name="a"><i>✓</i>单选框</label><br>

	</li>

	<li class="table-view-cell ">

	<label class="radioboxCheck"><input type="radio" name="b" checked><i>✓</i>单选框</label><br>

	</li>

	<li class="table-view-cell ">

	<label class="radioboxCheck"><input type="radio" name="c" ><i>✓</i>单选框</label><br>

	</li>

</ul>

<div id="ggs"></div>

<script>

$(".table-view .radioboxCheck").bind("click",function (e) {

	var index = $(this).parent().index();

	var obj = $(this).parent().parent().find("li");

	var len = obj.length;

	if(len < 1 || len == null || len == "undefiend")return false;

		for(var i=0; i<len;i++)

		{

			if(i == index)

			{

				obj.eq(i).find("label > input[type='radio']").attr("checked",true);

			}else{

				obj.eq(i).find("label > input[type='radio']").attr("checked",false);

			}

		}

    });

</script>

</body>

</html>

　　

js：for循环ul/li，获取当前被点击元素的id，以及给其他li设置属性的更多相关文章

  1. jquery 获取被点击元素的id属性值

    有时候可能需要获取被点击元素的一些信息,此处就以id属性为例子,进行演示一下. $(document).click(function (e){ var v_id=e.target.id; consol ...

  2. 获取点击元素的id

    1.onclick="dianji(this.id)" 传入id到方法里function dianji(id){ //这个就是id}2. $(document).click(fun ...

  3. jquery点击li 获取当前父节点所在类的索引

    jquery点击li 获取当前父节点所在类的索引 $('.jbcz').find('.content li').click(function(){ //alert($('.jbcz').find('. ...

  4. struts2学习笔记（2）---Action中訪问ServletAPI获取Map类型的Servlet元素

    源码: strust.xml <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE struts ...

  5. js for循环中点击事件中无法获取每一个i值的问题

    好像是第二次遇到这个问题,必须要总结一下!! <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  6. 【笔记】js获取当前点击元素的索引

    以前用jq 做过图片切换 滑动之类的特效现在想用js 试试是怎么一回事 jq图片切换的思路是用index()函数获取当前点击的按钮的索引然后根据索引值将对应索引的图片显示出来 于是查了一下js 是如何 ...

  7. js和jquery获取当前对象的子元素

    开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...

  8. js if for 详解 获取元素方式 及一些js 基础知识

    ##获取元素的新方法## --document.querySelector('Css Selector{css选择器}') 接收一个css选择器(通配,群组,类,包含,id....等) 若这个选择器对 ...

  9. Vue.js：循环语句

    ylbtech-Vue.js:循环语句 1.返回顶部 1. 循环语句 循环使用 v-for 指令. v-for 指令需要以 site in sites 形式的特殊语法, sites 是源数据数组并且 ...

随机推荐

  1. asp.net mvc4连接mysql

    环境:vs2013+mysql5.6+mysql connector for .net 6.8.3+MySQL for Visual Studio 1.1.3 参考:http://dev.mysql. ...

  2. How to make asynchronous HTTP requests in PHP 4种PHP异步执行的常用方式

    [是否等待返回就执行下一步] How to make asynchronous HTTP requests in PHP - Stack Overflow https://stackoverflow. ...

  3. SSL逐渐演变到TLS

    w https://zh.wikipedia.org/wiki/超文本传输安全协议

  4. python系列四：Python3字符串

    #!/usr/bin/python #Python3 字符串#可以截取字符串的一部分并与其他字段拼接var1 = 'Hello World!'print ("已更新字符串 : ", ...

  5. 2014-08-28——PC端几款主流浏览器的内核

    Trident(IE浏览器) Mozilla(Gecko)(熟悉的有Firefox,Flock等浏览器) WebKit(熟悉的有Safari.Chrome等浏览器) Opera(presto)(Ope ...

  6. ThreadPoolExecutor 线程池任务队列分析 与 利特尔法则（Little's law）

    一. 演示 public class ThreadPoolTest { static class MyThread implements Runnable { private String name; ...

  7. 3.2 使用STC89C52控制MC20发送短信

    需要准备的硬件 MC20开发板 1个 https://item.taobao.com/item.htm?id=562661881042 GSM/GPRS天线 1根 https://item.taoba ...

  8. image has dependent child images

    在删除镜像之前要先用 docker rm 删掉依赖于这个镜像的所有容器(哪怕是已经停止的容器),否则无法删除该镜像. 停止容器 # docker stop $(docker ps -a | grep ...

  9. ajax json 异步请求

    function ajaxTest(){ if (true) { $.ajaxSettings.async = false; var dataJson; $.getJSON("/univer ...

  10. Funq之Lambda表达式2

    Last month I started a series of posts covering some of the new VB and C# language features that are ...