当前位置:首页>开发>正文

js怎么实现点击表格图片显示和消失 jquery中show(),先显示,后又立即消失,麻烦帮我看看

2023-07-30 10:01:27 互联网 未知 开发

 js怎么实现点击表格图片显示和消失 jquery中show(),先显示,后又立即消失,麻烦帮我看看

js怎么实现点击表格图片显示和消失

这个问题其实想要实现的效果不难,但关键在于你的数据是灵活变化的还是固定不变的?
(1)如果是固定的,我是指(表格大小,长宽,位置均不变,但图片内容是可以变化的),这个就很容易写,我写了一个简单的Demo
HTML:







.sel tr td{ 
width: 80px 
background:#09f 
height: 20px
text-align: center
color:#fff
cursor: pointer
}
table tr td img{display: none} /*这里我先把图片隐蔽了*/





        







    
             
    
        
        2
3
     



function fToggle(objId){

//触发事件后,根据传入的参数获取对应的图片的display值
var state = document.getElementById(objId).style.display

//再进行设置显示或是隐藏就行了
if( state == block ){
document.getElementById(objId).style.display = none
}
else{
document.getElementById(objId).style.display = block
}
}

(2)如果是变化的(指图片多少,表格大小均可以变化),那这里就相对复杂些,不过思路依然是可以沿用上面的思路去做的!这里我就不写了,比较麻烦

jquery中show(),先显示,后又立即消失,麻烦帮我看看


    $(.view).click(function(event){        
            $(#div1).show()
         event.preventDefault()
    })
这样试试看,如果能够解决问题的话,原因就是a标签点击后页面跳转导致页面刷新

jquery中的这段代码没有效果,点击按钮图片应该消失

你把jQuery的写法和js的写法弄混了吧。jQuery的写法应该是:
 $(function(){
     $("#btn").click(function(){
        $("#box").css({"display":"none"})
        //$("#box").animate({"height":"300px"})
    })
   })