jQuery模仿单选按钮选中效果
(编辑:jimmy 日期: 2024/11/20 浏览:3 次 )
刚开始学jquery,工作中有些css表单中的按钮美化很麻烦,所以想着用jquery来替换,复选框的jquery很容易,就是简单的样式切换效果,用toggleClass()方法即可。
而单选框之前一直不知道怎么做,因为在单选框中选中一个,其他的都必须移除掉样式,如果2个单选框在同级中则用siblings()则可直接找到其他单选框移除掉样式即可。鉴于自己工作是循环列表模式,每个<li>里面都带有一个单选框,未发现jquery中parent()这个好用的方法,以致于纠结了半天。
css如下:
<!DOCTYPE html> <html class="area"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"> <title>设置-收货地址</title> <link rel="stylesheet" href="../css/app.css"> <script src="/UploadFiles/2021-04-02/jquery.js">效果如下:无论如何都只能一个添加样式,右边文字也随点击改变。
以上所述是小编给大家介绍的jQuery模仿单选按钮选中效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
下一篇:JS实现iframe编辑器光标位置插入内容的方法(兼容IE和Firefox)