例如有多个div,想要实现类似radio的效果。

<div name="teacher" selected="selected">tch1</div>

<div name="teacher">tch1</div>

<div name="teacher">tch1</div>

<div name="student">stu1</div>

<input text="tch1" id="txtSelectValue"/>

可以通过添加自定义属性"selected",通过jquery实现同一name下的只有一个div拥有selected="selected" 。然后就可以通过selected属性来找到选中的div了。

$(document).ready(function () {

$("div[name=teacher]").click(function () {

$(this).addClass("selected").attr("selected", "selected").siblings("div[name=teacher]").removeAttr("selected").removeClass("selected");

$("#txtSelectValue").val($(this).html());

// 或者 $("#txtSelectValue").val($("div[name=teacher][selected=selected]").html());

});

});

给html元素添加自定义属性,并且用jquery进行筛选的更多相关文章

  1. angular5 给元素添加自定义属性

    今天尝试给一个a 标签添加一个自定义属性,用于存放相关数据,但是angular templates 编译不通过. <a href="javascript:void(0);" ...

  2. 给Jquery动态添加的元素添加事件

    给Jquery动态添加的元素添加事件 来源:[http://wangqixia.diandian.com/post/2011-05-10/6597866] 我想很多人都会向我一样曾经 被新元素的事件绑 ...

  3. 用JQuery动态为选中元素添加/删除类

    在做一些tab页功能时,我们经常会见到如下样式: 即当选中一个元素时,在此元素下会添加相应的类,以示区别.今天就研究了一下如何用JQuery实现此效果. 1. HTML代码 <a id=&quo ...

  4. [转载]给Jquery动态添加的元素添加事件

    原文地址:给Jquery动态添加的元素添加事件作者:小飞侠 我想很多人都会向我一样曾经 被新元素的事件绑定困惑很久也就是在页面加载完成后给元素绑定了事件,但又新增加的元素上却没有绑定任何事件. js的 ...

  5. jquery无法为动态生成的元素添加点击事件的解决方法

    遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...

  6. jquery:为动态加载的元素添加点击事件

    jquery:为动态加载的元素添加点击事件 最近在做项目的时候遇到了这样一个问题,给用ajax动态加载出来的内容添加点击事件,但是怎么都触发不了,经过查询试验总结出正确的写法 在jquery1.7之前 ...

  7. JQuery为元素添加样式的实现方法

    由于jquery支持css3,所有能很好的兼容很多浏览器,所以通过jquery来使用css样式比较好 为定义好的css样式可以调用元素的css方法添加样式 $("span").cs ...

  8. add(expr|ele|html|obj[,con]) 把与表达式匹配的元素添加到jQuery对象中。

    add(expr|ele|html|obj[,con]) 概述 把与表达式匹配的元素添加到jQuery对象中.这个函数可以用于连接分别与两个表达式匹配的元素结果集. jQuery 1.4 中, .ad ...

  9. Jquery获取select option动态添加自定义属性值失效

    Jquery获取select option动态添加自定义属性值失效 2014/12/31 11:49:19 中国学网转载 编辑:李强 http://www.xue163.com/588880/3909 ...

随机推荐

  1. 关于iScroll在安卓移动端/chrome模拟移动端上下滑动卡顿问题处理!!!!真实可靠!!!已解决!!!

    滑动卡顿效果 安卓手机打开微信浏览网页,Chrome模拟手机浏览网页,都出现的问题滑动卡顿! 修改代码点: 1.    <style type="text/css">  ...

  2. 通过编写Java代码让Jvm崩溃

    在书上看到一个作者提出一个问题"怎样通过编写Java代码让Jvm崩溃",我看了之后也不懂.带着问题查了一下,百度知道里面有这样一个答案: 1 package jvm; 2 3 pu ...

  3. 移动端display:flex

    移动端display:flex布局时候,子元素有背景颜色时候,背景颜色不能铺满,有缝隙, // less .t-flex { background: blue; display: flex; > ...

  4. [PAT] A1020 Tree Traversals

    [题目] distinct 不同的 postorder 后序的 inorder 中序的 sequence 顺序:次序:系列 traversal 遍历 题目大意:给出二叉树的后序遍历和中序遍历,求层次遍 ...

  5. A Bug's Life____并查集

    English preparation: falsify     伪造:篡改:歪曲:证明...虚假 the sexual behavior of a rare species of bugs. 一种稀 ...

  6. 主机名由localhost变成bogon是怎么回事,怎样变回localhost这个名字?

    如何解决这个问题修改你的 DNS 为公共 DNS,例如 114.114.114.114 或者谷歌的 8.8.8.8.然后修改你的主机名: sudo hostname localhost 出现这个问题的 ...

  7. Laravel中使用QRcode自制二维码

    一.配置 1.在项目根目录输入命令 composer require simplesoftwareio/simple-qrcode 1.3.* 2.在config/app.php 的 provider ...

  8. 查看Spark与Hadoop等其他组件的兼容版本

    安装与Spark相关的其他组件的时候,例如JDK,Hadoop,Yarn,Hive,Kafka等,要考虑到这些组件和Spark的版本兼容关系.这个对应关系可以在Spark源代码的pom.xml文件中查 ...

  9. 《NVM-Express-1_4-2019.06.10-Ratified》学习笔记(5.23)-- Format NVM command

    5.23 Format NVM command - NVM Command Set Specific Format NVM命令用于低级格式化NVM媒介.这个命令被host主机使用,来变更LBA数据大小 ...

  10. 题解【AcWing10】有依赖的背包问题

    题面 树形 DP 的经典问题. 我们设 \(dp_{i,j}\) 表示当前节点为 \(i\),当前节点的子树(包含当前节点)最多装的体积是 \(j\) 的最大价值. 我们遍历节点的过程就相当于做了一遍 ...