jquery如何实现按钮a点击后更换按钮a的背景图片为a.gif点击按钮b按钮a背景图片还原,b的背景图片为b.gif

因为按钮比较多能否写个循环

模拟HTML代码

<input type="button" value="a" />
<input type="button" value="b" />
<input type="button" value="c" />
<input type="button" value="d" />
<input type="button" value="e" />

<script type="text/javascript">
    $(":button").click(function(){
       $(this).css("background","url('images/"+$(this).val()+".gif')");
       $(this).siblings(":button").each(function(){
           $(this).css("background","原图路径");
       });
    });
</script>

追问

如果是开始不是插入的按钮连接 而是不同的图片连接 这样写是不是不行啊~!

追答

不太懂你的意思哦~~~,你把你的代码贴出来看看吧。

图片名称,一定要和按钮名称有关系,才好替换。要不然没有规律,就没法替换了。

温馨提示:内容为网友见解,仅供参考
第1个回答  2013-06-14

根据你的提问,是这样写:

    $(function(){
        $(".a").click(function(){
            $(this).css("background","url(images/a.gif)");
        });
        $(".b").click(function(){
            $(".a").css("background","url(images/c.gif)");
            $(this).css("background","url(images/b.gif)");
        });
    })

按钮比较多能否写个循环?这个得看到你html文档的结构才好写~

追问

帮我看看楼上发的代码 这样改咋整~!

第2个回答  2013-06-14
handangaoyang给的代码基本能解决问题.不同按钮有不同背景图片组的话,从命名上设一个规则就可以搞定.
比如button id=btnA,
默认图片名为btnADF.gif, 规则:按钮名+"DF"+".gif"
点击后(激活)btnAAct.gif,规则:按钮名+"Act"+".gif"
按钮被点击时传递自身ID出去,先把所有同级按钮除自身设默认,再把自身设激活就可以.追问

像这种怎么弄啊~!

追答

你要控制什么,?
原始图片一样的话,那就直接调原始图片的地址就好了.

本回答被网友采纳

jquery点击切换图片(jquery切换页面)
先给导航块的a标签设置img属性和data-img属性;img属性为未选中图片,data-img为选中图片。第一个按钮的img图片应设置为默认选中的状态。\/\/点击每个按钮后进行按钮切换图片操作 (".tab-bar-item").on("click",?function?()?{ \/\/先constclickImg变量为他的data属性(选中图片),然后找到img图片的s...

jquery怎么实现点击一个元素更换背景图片,连续点击永远在2张图片之间...
no ^= 1;('body').css('background-image', 'url(' + arr[no] + ')');} 3、浏览器运行index.html页面,此时显示出了其中1张背景图片。4、再点击“点击更换”按钮,此时背景图片又被更换到另一张。

jquery中如何改变按钮背景色
点击1—1变色。点击2,—变色。但1会变回原来的颜色,我show方法实现了其他的功能.。下面是我初试的代码: HTML code:复制代码 代码如下:<style type="text\/css"> .clckClass{color:red;} <\/style> <script type="text\/javascript"> $('ul li a').bind('click', function(){ $('ul li...

jquery实现点击a标签后添加背景颜色
4、在test.html文件内,使用button标签创建一个按钮,按钮名称为“添加一个a标签”。5、在test.html文件内,给button按钮绑定onclick点击事件,当按钮被点击时,执行addaa()函数。6、在js标签中,创建addaa()函数,在函数内,创建一个变量html保存要添加的a标签,再使用append()方法向被选对象(p标签...

jquery代码 点击按钮更换图片
举个例子:假设你已经引入了jquery,而html结构如下:<div id="swphoto"> <img src="1.jpg"> <img src="2.jpg" style="display:none;"><\/div>那么你的js可以这么写:("#swphoto").click(function(){ $("#swphoto>img").toggle();});

jquery点击图标来回切换的几种方法(如开关
\/\/点击每个按钮后进行按钮切换图片操作 (".tab-bar-item").on("click", function () { \/\/先const clickImg变量为他的data属性(选中图片) ,然后找到img图片的src属性将未选中的图片点击后替换为选中图片 const clickImg = $(this).data("img");(this).find("img").attr("src",clickImg)...

JS\/Jquery,如何实现背景图片的更换
1.jpg) no-repeat 0 0");2、写两个class,一个class里面写一个背景图片,js中操作的话直接改变元素的class就可以了 (this).removeClass('classA').addClass('classB');相对而言,第二种方式更好一点,实现了js中尽量不书写css的理念,同时第二种可以实现背景图片不断替换,而第一种不行 ...

jquery如何做导航菜单栏点击更换背景色(防刷新)
给每个菜单给以相同的ID、、然后给ID绑定点击事件,当前菜单点击时注入一个css的class,其他的注入默认的class。差不多就可以了。

Jquery效果,点击切换文字,变换背景颜色,再次点击,文字和背景色变回来...
DOCTYPE HTML><html><meta charset="UTF-8" \/><head><title>YuGiOh Power Of Chaos<\/title><style type="text\/css">body {margin: 0;padding: 0;font: 12px\/1.5 \\5b8b\\4f53, Arial, sans-serif;}div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,...

怎样实现点击更换页面背景图片并后台自动加载新背景图
给你提供个思路吧。把所有的背景图片都加载到一个数组变量中,然后当点击按钮时就从这个数值中往下读一个,然后再点再读,这样就好了~

相似回答