zoukankan      html  css  js  c++  java
  • 鼠标点击文字选中复选框

    在前台,我们经常用复到选框,来选择多个感兴趣的对象,但只有单击复选框才可选中。现用jQuery写了一小段代码,实现鼠标点击文字选中复选框。
    <html>
    <head>
    <title>鼠标点击文字选中复选框</title>
    <script language="javascript" type="text/javascript" src="jQuery1.3.2/jquery-1.3.2.min.js"></script>
    <!-- 当鼠标在文字之上显示为手形 -->
    <style type="text/css">
    .hand{ cursor : hand ;}
    </style>
    </head>
    <body>
    <div><input type="checkbox" value="film" name="hobby" checked="checked"><span>film</span></div>
    <div><input type="checkbox" name="hobby"><span>game</span></div>
    <div><input type="checkbox" name="hobby"><span>books</span></div>
    <script language="javascript" type="text/javascript">
    $("span").bind("mouseover",function(){$(this).addClass("hand");}).bind("click",function(){
    // 由span标签获取input标签 var obj=$(this).parent().children(0);
    if(obj.attr("checked")==true){ obj.removeAttr("checked"); }
    else { obj.attr("checked","checked"); }
    });
    </script>
    </body>
    </html>
    功能虽然实现了,但还有点不满意,就是标签的嵌套,加上div才实现这个功能。不知大家有何好的idea,望不吝赐教啊!
  • 相关阅读:
    010-spring事务管理
    009-事务管理
    008-ThreadLocal
    Bmob用户管理操作
    Textview下划线注册用户跳转实现
    Android中多个调用Activity的问题
    解决android:theme="@android:style/Theme.NoDisplay" 加入这句话后程序不能运行
    友盟自动更新
    友盟消息推送和更新XML配置
    Android 云服务器的搭建和友盟APP自动更新功能的实现
  • 原文地址:https://www.cnblogs.com/qingliuyu/p/1789679.html
Copyright © 2011-2022 走看看