Javascript 如何设置onclick后在JQUERY中包含image和div span内容

我有一个使用CSS sprite的代码，尽管我点击了图像，整个div内容的颜色也改变了，包括单词的内容，但代码仍在工作。但是当我点击与图像堆叠在一起的内容词时，内容词确实会改变颜色，但图像仍然保持不变，不会变为蓝色

我们可以用Jquery方法来实现这个功能吗

/*隐藏单选按钮*/
.游戏子菜单输入[类型=收音机]{
显示：无
}
/*为标签设置一个框，这是单击的内容*/
.游戏子菜单标签{
显示：块；
宽度：150px；
高度：100px；
}
/*设置图像…这将更好地用于精灵*/
.games子菜单标签.topimg1{
背景图像：url（“http://placehold.it/150x100/FF0000/FFFFFF/?text=Image1");
}
.games子菜单输入[类型=收音机]：选中+标签.topimg1{
背景图像：url（“http://placehold.it/150x100/?text=Image1");
}
.games子菜单标签.topimg2{
背景图像：url（“http://placehold.it/150x100/00FF00/FFFFFF/?text=Image2");
}
.games子菜单输入[类型=收音机]：选中+标签.topimg2{
背景图像：url（“http://placehold.it/150x100/?text=Image2");
}

编辑精选


编辑精选

这样更改html代码，保存文本的

span

将成为标签的子元素，这样，文本上的clik也将单击标签，这将更改输入的检查状态，css也将更改：

<div class="games-platform-item pt-item">
  <ul class="games-sub-menu clearfix">
    <li class="tab2 current">
      <label class="topimgG2" for="rdoImg2">
         <input type="radio" name="imgSwap" id="rdoImg2">
         <span>编辑精选</span>      
      </label>
    </li>
  </ul>
</div>

编辑精选        


编辑精选        

在

上单击事件只需更改正在单击的特定div的背景图像即可

通过jQuery，您可以删除以前的
类
，并添加另一个具有不同背景属性的
类

示例-

.games-sub-menu label.topimgG1Clicked {
  background-image: url("http://placehold.it/150x100/FF0000/FFFFFF/?text=ImageChangedImage");
}

在javascript
中，单击事件：

$(this).closest('label').removeClass('topimgG1');
$(this).closest('label').removeClass('topimgG1Clicked');

你也可以发布你的JS吗？也许会创建一个？@IvanModric Hi，我是一个新的im学生，因此我对js方法一无所知。你能具体说明你想要实现什么吗？当一个按钮被点击时，它应该改变颜色吗？@IvanModric我试图证明的是，当按钮被点击时，图像应该改变为其他图像。看起来它已经这样做了，或者这种改变应该是永久性的？如果是这样：当再次单击同一个图像时会发生什么？您好，您的代码不是正确的方式，因为单词被移动到了图像内部。图像外部的“移动单词”只是css。