Southern Wind 2022-10-11 11:12 采纳率: 51.5%
浏览 34
已结题

jq获取动态标签并添加图片

img


想要达成这样的效果
这是一个缩略轮播图,每个缩略图都有不同的多个p标签。现在已经实现点击右侧不同的p标签后添加一个img节点,我这段代码问题在于点击第一页的p标签后,每页都会添加一个img,我只想点击第一页的p标签来显示第一页的三组图片,点击第二页显示对应的多组图片,有人有好的写法嘛,我的jQuery用的不是很好。

    /* 小缩略图的点击事件 */
    $('.mySwiper .swiper-slide').click(function () {
      console.log($(this).index());
    })

    /* 每一页的图片 */
    var obj = {
      arr1: ['./images/c1OFC.png', './images/c1SF.png',],
      arr2: ['./images/c2ACA.png', './images/c2OFC.png', './images/c2SF.png']
    }
    /* 文字的点击事件 */
    $("p").click(function () {
      if ($(this).hasClass("selected")) {
        $(this).removeClass("selected");
        $('.bg:eq(0)').remove($img)

      } else {
        /* 添加颜色 */
        $(this).addClass("selected");
        var $img = $("").attr('src', obj.arr1[$(this).index()]).addClass('bg')
        $('.bg1').after($img)
      }
    });

img

img

img

  • 写回答

2条回答 默认 最新

  • _yangyi 2022-10-11 11:48
    关注

    我推测应该是你用class选择器的缘故,你给每页用不同的class名或者用id选择器试试

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 10月19日
  • 已采纳回答 10月11日
  • 创建了问题 10月11日

悬赏问题

  • ¥20 请问这种量表怎么用spss量化分析(作为中介模型的因变量
  • ¥55 AD844 howland电流源如何驱动大额负载
  • ¥15 C++ /QT 内存权限的判断函数列举
  • ¥15 深度学习GFnet理解问题
  • ¥15 单细胞小提琴堆叠图代码
  • ¥50 升级strust2版本到2.3.15.1后使用ognl3.0.6.jar windows环境中没有问题,但部署到linux环境报错
  • ¥15 vue页面,node封装接口
  • ¥15 求TMS320F280039C工程模板!
  • ¥15 delphi+fastreport实现分组补空打印问题
  • ¥15 使用python把两台mysql数据库服务器数据导出和导入