欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

jQuery单按钮实现图片的显示与隐藏

程序员文章站 2022-07-13 12:59:03
...
  1. 很多人在做这个的时候会形成一个思维误区,习惯用click来实现,事实上click是个单独函数是实现不了用一个按钮来解决的,所以我们就要用到toggle(用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件
    如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。
    );
    //实现代码
<script type="text/javascript">
$(function(){
//toggle
 $('input[value="显示图片"]').toggle(function(){
     $("img").eq(0).attr({ "src":"image/图十四.jpg"})
     $('input[value="显示图片"]').attr({"value":"隐藏图片"});   

 },function(){
     $("img").eq(0).removeAttr("src")
     $('input[value="隐藏图片"]').attr({"value":"显示图片"});
 });



});


<body>
<input type="button" name="button" value="显示图片">
</body>