www.msyz555.comcheckbox选中以后形状,获取选中元素兄弟节点文本

需求:点击确定按钮,获取指定ul.class中的选中形状兄弟节点文本

题目是,只要第一行的checkbox生效啊???

贴代码,

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <style>
        *{
            margin:0;
            padding:0;
        }
        ul,ol{
            list-style: none;
        }
        li{
            padding:20px;
            border:1px solid #f00;
            height: 50px;
        }
        li input{
            display: none;
        }
        li input + span{
            display: none;
            padding:2px;
            background-color: #ff3600;
        }
        li label{
            position: absolute;
            display: block;
            width:100%;
            height:50px;
        }
        li input:checked + span{
            display: block;
        }
        button{
            padding:20px;
        }
    </style>
</head>
<body>
   <div class="quan-cont">
       <ul class="fanxian">
           <li>
               <label >
                   <input type="checkbox" name="quan">
                   <span>aa1</span>
               </label>

           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa2</span>
               </label>
           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa3</span>
               </label>
           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa45</span>
               </label>
           </li>
       </ul>
       <ul class="jiaxi">
           <li>
               <label >
                   <input type="checkbox" name="quan" >
                   <span>aa11</span>
               </label>

           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa33</span>
               </label>
           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa22</span>
               </label>
           </li>
           <li>
               <label>
                   <input type="checkbox" name="quan">
                   <span>aa55</span>
               </label>
           </li>
       </ul>
       <button id="btn">
            确定
       </button>
   </div>
    <script>
        $function  {
            $ul.onclick,li,function  {
                if$this.findinput:checkbox.propchecked{
                                                              $this.siblings.findinput:checkbox.propchecked,false;
               }
            };

            $#btn.onclick, function  {
                var ul = $ul;
                ul.eachfunction  {
                    iful.propclass,fanxian{
                        var cur = $this.findinput[name=quan].propchecked;
                       ifcur{//假如有选中
                           var quanText = $"input[name=quan]:checked".nextspan.text;
                           console.logquanText;//只要第1行生效? 当点击第其他个Li的时分text值取不到..
                       }
                        return false;
                    }
                    iful.propclass,jiaxi{
                       //....
                    }
                };
            }


        };
    </script>
</body>
</html>

说几个大题目
第一个题目:iful.propclass,fanxian{};这个判别的只是给你选中的每个ul的class改为”fanxian”;按照你的意思应该为iful.hasClass”fanxian”{}。
第二个题目:var cur = $this.findinput[name=quan].propchecked;
这个在ul中找到input[name=quan]的聚集,关于后面的属性propchecked,只选择第一个中断获取,
以是$this.findinput[name=quan].propchecked在第一个input选中的时分,为true,选择其他的同类input时分为false;按照你的意思应该为
var cur = $this.findinput[name=quan]:checked

我没有看懂你写的,但是我给你提供一个想法,你如今不是能点击获得checked的了吗?你把这个dom节点放在一个变量里,如许你获取值的时分就可以获取了

var cur = $this.findinput[name=quan].propchecked; 这里有题目,find找到统统input而你只判别了第一个,那你不是选第一个的时分就false的
别的你是想把选中的笔墨打印出来的话,
var quanText = $”input[name=quan]:checked”.nextspan.text;这句曾经可以,后面的判别没意义

根据你的描绘,大约是这个意思,

var cur = $this.findinput[name=quan].propchecked;

这一句,后面 $this.findinput[name=quan] 你获得的是4个checkbox东西,然后这里后面直接跟propchecked,只会第一个checkbox中断判别,而不是你想的选中四个里面checked的那个

(看完/读完)这篇文章有何感想! www.msyz555.com的分享…

发表评论

姓名 *
电子邮件 *
站点