H_jsen 2016-02-27 08:11 采纳率: 0%
浏览 1818
已采纳

HTML代码修改了以后就没有效果,jQuery部分要怎么改?


【jQuery代码】
<script src="jquery-1.8.3.js"></script>
<script>
$(function(){
    $("ul.categories input").click(function(){
        var children = $(this).next();
        var isChecked = $(this).prop("checked");
        if(children){
            if(isChecked){
                children.find("input").prop("checked","checked");
            }else{
                children.find("input").removeProp("checked");
            }
        }
        var checkedCount = $(this).parent().parent().find(">li >input:checked").length;
        var count = $(this).parent().parent().find(">li >input").length;

        if(checkedCount == count){
            $(this).parent().parent().parent().find(">input").prop("checked","checked");
        }else{
            $(this).parent().parent().parent().find(">input").removeProp("checked");
        }

    });
});
</script>
【原HTML代码】
<ul class="categories">
    <li><input type="checkbox" />数码电子
        <ul>
            <li><input type="checkbox" />手机</li>
            <li><input type="checkbox" />电脑</li>
            <li><input type="checkbox" />U盘</li>
            <li><input type="checkbox" />相机</li>
        </ul>
    </li>
    <li><input type="checkbox" />服装
        <ul>
            <li><input type="checkbox" />毛衣</li>
            <li><input type="checkbox" />T恤</li>
            <li><input type="checkbox" />羽绒服</li>
            <li><input type="checkbox" />秋裤</li>
        </ul>
    </li>
</ul>
【修改部分HTML代码】——之后就没有反应了,请问jQuery部分要怎样修改
<ul class="categories">
    <li><h1><input type="checkbox" /><i class="icon checkbox"></i><a href="#">数码电子</a></h1>
        <ul>
            <li><input type="checkbox" />手机</li>
            <li><input type="checkbox" />电脑</li>
            <li><input type="checkbox" />U盘</li>
            <li><input type="checkbox" />相机</li>
        </ul>
    </li>
    <li><h1><input type="checkbox" /><i class="icon checkbox"></i><a href="#">服装</a></h1>
        <ul>
            <li><input type="checkbox" />毛衣</li>
            <li><input type="checkbox" />T恤</li>
            <li><input type="checkbox" />羽绒服</li>
            <li><input type="checkbox" />秋裤</li>
        </ul>
    </li>
</ul>
  • 写回答

4条回答 默认 最新

  • Go 旅城通票 2016-02-27 12:19
    关注

    代码要依据结构来修改,结构改了当然没有效果

     <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
    <ul class="categories">
        <li>
            <h1><input type="checkbox" /><i class="icon checkbox"></i><a href="#">数码电子</a></h1>
            <ul>
                <li><input type="checkbox" />手机</li>
                <li><input type="checkbox" />电脑</li>
                <li><input type="checkbox" />U盘</li>
                <li><input type="checkbox" />相机</li>
            </ul>
        </li>
        <li>
            <h1><input type="checkbox" /><i class="icon checkbox"></i><a href="#">服装</a></h1>
            <ul>
                <li><input type="checkbox" />毛衣</li>
                <li><input type="checkbox" />T恤</li>
                <li><input type="checkbox" />羽绒服</li>
                <li><input type="checkbox" />秋裤</li>
            </ul>
        </li>
    </ul>
    <script type="text/javascript">
        $(function () {
            $("ul.categories input").click(function () {
                var children = $(this).parent().next();
                var isChecked = $(this).prop("checked");
                var isParent = false;
                if (children.is('ul')) {
                    if (isChecked) {
                        children.find("input").prop("checked", "checked");
                    } else {
                        children.find("input").removeProp("checked");
                    }
                    return///顶级checkbox不需要执行下面
                }
                var checkedCount = $(this).parent().parent().find(">li >input:checked").length;
                var count = $(this).parent().parent().find(">li >input").length;
    
                if (checkedCount == count) {
                    $(this).parent().parent().parent().find(">h1 input").prop("checked", "checked");
                } else {
                    $(this).parent().parent().parent().find(">h1 input").removeProp("checked");
                }
    
            });
        });
    </script>
    

    http://ask.csdn.net/questions/239196

    解决了,这个也记得采纳了,

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

悬赏问题

  • ¥15 sqlite 附加(attach database)加密数据库时,返回26是什么原因呢?
  • ¥88 找成都本地经验丰富懂小程序开发的技术大咖
  • ¥15 如何处理复杂数据表格的除法运算
  • ¥15 如何用stc8h1k08的片子做485数据透传的功能?(关键词-串口)
  • ¥15 有兄弟姐妹会用word插图功能制作类似citespace的图片吗?
  • ¥200 uniapp长期运行卡死问题解决
  • ¥15 latex怎么处理论文引理引用参考文献
  • ¥15 请教:如何用postman调用本地虚拟机区块链接上的合约?
  • ¥15 为什么使用javacv转封装rtsp为rtmp时出现如下问题:[h264 @ 000000004faf7500]no frame?
  • ¥15 乘性高斯噪声在深度学习网络中的应用