flybird99 2017-09-17 00:51 采纳率: 100%
浏览 5870
已采纳

遍历某DIV下所有li,并在每个子li点击时触发此DIV的样式修改

如题,我是这样写的,不知道哪里不对,请帮忙调下,谢谢!

 <script>
   window.onload=function(){
     var divs =  document.getElementsByTagName("#col-lg-2");
    $("#dd-item").onclik(function()
            {divs.style.csstext='width: 25%; height:100%; position:fixed; top:350px; overflow-y:3px;'}) 
        }
 </script>      

 <div id="col-lg-2" class="col-lg-2" style="width: 25%">
  <ol class="dd-list">
                                    <li class="dd-item" data-id="1">
                                        <div class="dd-handle" id="li_Preliminary_Analysis">初步分析</div>
                                    </li>
                                    <li class="dd-item" data-id="2">
                                        <div class="dd-handle" id="li_Early_Disposal">先期处置</div>
                                    </li>
                                    <li class="dd-item" data-id="3">
                                        <div class="dd-handle" id="li_Middle_Disposal">中期处置</div>
                                                                                                        </li>
                                </ol>
                                </div>

最好能将具体调整代码示范,不做过多设置

  • 写回答

9条回答 默认 最新

  • 面向对象的夜猫子 2017-09-17 02:48
    关注
     <script>
        window.onload=function(){
            var $_oDiv = document.querySelector("#col-lg-2");
            var $_aLis = $_oDiv.querySelectorAll('li');
            $_aLis.forEach(function(index, item){
                this.onclick = function(){
                    $_oDiv.style.cssText='width: 25%; height:100%; position:fixed; top:350px; overflow-y:3px;
                }
            });
        }
    </script>
    
    <div id="col-lg-2" class="col-lg-2" style="width: 25%">
        <ol class="dd-list">
            <li class="dd-item" data-id="1">
                <div class="dd-handle" id="li_Preliminary_Analysis">初步分析</div>
            </li>
            <li class="dd-item" data-id="2">
                <div class="dd-handle" id="li_Early_Disposal">先期处置</div>
            </li>
            <li class="dd-item" data-id="3">
                <div class="dd-handle" id="li_Middle_Disposal">中期处置</div>
            </li>
        </ol>
    </div>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(8条)

报告相同问题?

悬赏问题

  • ¥15 FutureWarning:不推荐使用空或全 NA 条目的 DataFrame 串联行为。怎么改呢?
  • ¥15 Chatgpt突然无法正常显示数学公式,如何解决?
  • ¥15 8位抢答器,按照课本写完代码,无法实现功能,如何解决?(关键词-数码管)
  • ¥15 一个用华为模拟器做的实验。
  • ¥28 opencv Cuda C++编译
  • ¥15 插入sim卡4g模组反复断连
  • ¥100 如何把 16bit Bayer 图像数据转换为 TIFF RGB
  • ¥15 进行基于用户的协同过滤推荐,使用准确率和召回率评价推荐模型的效果
  • ¥15 word脚注设置不起空格符号
  • ¥15 为什么apriori的运行时间会比fp growth的运行时间短呢