首页 新闻 搜索 专区 学院

求助求助,使用js实现隐藏以及显示tr,这个环境配置我并不了解,是因为限制么。

0
[已关闭问题] 关闭于 2018-08-06 12:57

大致写一下我的代码:

        function f_display_plan(){

                var objBtn = document.getElementById("display_plan");

                var objTr = document.getElementById("plan");

                if(objTr.style.display = "none"){

                        objTr.style.display = "";

                        objBtn.src = "html/img/btn_min.gig";

                }else{

                        objTr.style.display = "none";

                        objBtn.src = "html/img/btn_max.gig";

                }

        }

______________

<tr><td>

        <img src = "html/img/btn_min.gig" id="display_plan" onclick="f_display_plan()">

</td></tr>

<tr id="plan" ><td>

        略;

</td></tr>

 

大致结构就是这样了,可是页面根本没反应;

有趣的是,我第一次objBtn ,objTr 这两个上下不一致,大小写写错了,但是竟然实现了隐藏,页面检查提示未定义objbtn ,我改正后单击事件没有任何反应,检查元素也丝毫没有反应,我也是没检查出哪里写错了,各位大神帮帮我,感激不尽。

还有一个问题,记得不清楚了,我总觉得蓝色是正规写法啊,为什么红色的页面才会默认隐藏,蓝色的不隐藏,jsp这里我是真的蒙住了;;;

<tr id="plan" style="display:none"><td>

        略;

</td></tr>

<tr id="plan" display="none"><td>

        略;

</td></tr>

 

再次感谢!!!!

聆柒的主页 聆柒 | 初学一级 | 园豆:187
提问于:2018-08-06 11:43
< >
分享
所有回答(2)
0

objTr.style.display == "none"   2个等号   少了1个

河畔 | 园豆:723 (小虾三级) | 2018-08-06 12:58

感谢,感谢。==那个是我打错了,因为远程桌面无法复制到本地。至于函数为什么不好使,我找到原因了,就是对方系统出现的问题,项目比较老旧,只能用IE浏览器,总会取不到最新项目;解决方案,重启Tomcat,重启浏览器,就好使了,很戏剧性。再次感谢!!!

支持(0) 反对(0) 聆柒 | 园豆:187 (初学一级) | 2018-08-06 15:27
1

首先,先说你那个问题,display:none的问题。

对于浏览器,第二种写法 display="none" 肯定是错的。原生的html属性中应该是没有display属性的(好像个别有,记不清了),就算是有,浏览器也不会认为这个属性是用来控制是否显示。

而显示/隐藏本身属于浏览器渲染样式的范畴,应该由CSS来定义,那么再元素上声明css样式也就是你第一种写法 style="display:none" 

有些前端或后端框架,他们对模板视图进行解释,例如我们最常见的MVC(无论语言),或者Angular,Vue等,如果框架内对元素的display属性,做了特别的声明处理,那么会从服务器层面直接去掉需要隐藏的元素。例如Asp.net的WebForm中,部分控件就带有display属性,但是即使是有,也会在浏览器解释的时候,将其转化为标准的html元素。再传到浏览器。

 

再说你的JS

  if(objTr.style.display = "none"){ 这个我不知道你是写错了,还是贴错了,这个地方应该是 == 

如果是一个等于号,代码相当于

objTr.style.display = "none"
 if("none"){

这个操作,先对元素的display属性赋值,然后再判断这个字符串。

js中if内如果不是bool型,只要不为null或undefined,就一律为true。

那么的这个if也就失去了效果,总是会执行上面的代码,运行时代码就会等同于这个

 function f_display_plan(){

                var objBtn = document.getElementById("display_plan");

                var objTr = document.getElementById("plan");
                objTr.style.display = "none";
                objTr.style.display = "";
                objBtn.src = "html/img/btn_min.gig";

        }    

自然无法正常执行效果

写代码的相声演员 | 园豆:555 (小虾三级) | 2018-08-06 13:09

感谢,感谢。==那个是我打错了,因为远程桌面无法复制到本地,对于display那个我了解了,对于你说的个别,好像是Hbuilder里可以,回去我好好看看,你解释的非常到位;非常非常感谢。至于函数为什么不好使,我找到原因了,就是对方系统出现的问题,项目比较老旧,只能用IE浏览器,总会取不到最新项目;解决方案,重启Tomcat,重启浏览器,就好使了,很戏剧性。再次感谢!!!

支持(0) 反对(0) 聆柒 | 园豆:187 (初学一级) | 2018-08-06 15:25
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册