zoukankan      html  css  js  c++  java
  • poscms仿站知识点总结(二)

    1.相同类型div添加不同class

    遇到一个样式上的问题,模板页面有8个子项,样式都是一样,至于数据是可以用for循环来添加的,但是for循环的时候,每个div的

    类名是无法及时更改的,但是模板页面每个div是依靠class名来识别的,没有用this来指明当前对象,你可以想象一下它是这样实现

    hover效果的,class名为A的子项hover时,触发A的动效,class名为B的子项hover时,触发B的动效,而for循环出来的所有子项除了

    数据不一样,其余都是一样的,包括class名,最后,决定用js来给它们添加不同的类名,这样各自之间的动效就不会互相干扰了。

            <script type="text/javascript" >
                      var box=$(".box");
                      var size=box.length;
                      var classname="";
                      for(var i=0;i<size;i++){
                          if(i==0){
                              $(box[i]).removeClass("box");
                              $(box[i]).addClass("liBox");
                              
                          }else{
                              classname="liBox"+(i+1);
                              $(box[i]).removeClass("box");
                              $(box[i]).addClass(classname);                          
                          }            
                      }        
            </script> 

    这样,就还原了模板页面原本每个div的类名,原本的样式表又能起作用了,且不会因为类名相同而互相干扰。

    2.导航栏高亮的问题

    其实这个很简单了,定义一个类名,写出高亮的样式,然后在每个页面为其添加类名,和上面的差不多

        <script type="text/javascript">
            $(function(){
                var naveco=$(".NItem");
                $(naveco[0]).removeClass("NItem");
                $(naveco[0]).addClass("NItem  NItemCur");
            });
        </script>

    3.php与js之间的变量传值

                <input type="hidden" id="did" value={$cat.name}>
                <script type="text/javascript" charset="utf-8">
                    var naveco=$(".NItem");
                    var did=$("#did")[0].value;
                    if( did=="资费列表"){
                        $(naveco[1]).removeClass("NItem");
                        $(naveco[1]).addClass("NItem  NItemCur");
                    }else{
                        $(naveco[2]).removeClass("NItem");
                        $(naveco[2]).addClass("NItem  NItemCur");
                    }
                </script>

    这里巧妙的用了一个hidden的input标签,因为项目中两个栏目公用一个模板页面,那么导航栏的高亮问题,就需要根据传进来的

    一个变量值来判断该给哪一栏高亮。

    4.

  • 相关阅读:
    《结对-贪吃蛇游戏-测试过程》
    《课后作业-阅读任务-阅读提问-2》
    课后作业-阅读任务-阅读提问-3
    《20171005-构建之法:现代软件工程-阅读笔记》
    《结对-贪吃蛇游戏-项目进度》
    《团队-科学计算器-项目进度》
    《团队-科学计算器-代码设计规范》
    《团队-科学计算器-开发环境搭建过程》
    自制3D打印机---挤出头
    __construct 与 ThinkPhp _initialize 的区别
  • 原文地址:https://www.cnblogs.com/eco-just/p/9065364.html
Copyright © 2011-2022 走看看