使用显示器在点击时显示一些图像

下面是我的jQuery代码。该眼睛类包含一些用户单击时希望显示的眼睛图像,因此我正在使用此显示技术,但不适用于我

var eyesBorder = $('.eyes');
eyesBorder.click(function(e){
    for(let i = 0; i<eyesBorder.length; i++){
        $(e.target).css({"display":"block"});
        break;
    }

})

下面是对我有用的技术,但它花费了很多行,这就是为什么不想使用它

    eyesBorder.click(function(e){
    for(let i = 0; i<eyesBorder.length; i++){
        var er = $(eyesBorder).index(this);
        console.log(er)
        if(er==0)
        {
            eye2.css("display", "none")
            eye3.css("display", "none")
            eye4.css("display", "none")
            eye5.css("display", "none")
            eye1.css("display", "block")
        }
        else if(er==1)
        {
            eye3.css("display", "none")
            eye4.css("display", "none")
            eye5.css("display", "none")
            eye1.css("display", "none")
            eye2.css("display", "block")
        }
        else if(er==2)
        {
            eye2.css("display", "none")
            eye4.css("display", "none")
            eye5.css("display", "none")
            eye1.css("display", "none")
            eye3.css("display", "block")
        }
        else if(er==3)
        {
            eye2.css("display", "none")
            eye3.css("display", "none")
            eye5.css("display", "none")
            eye1.css("display", "none")
            eye4.css("display", "block")
        }
        else
        {
            eye2.css("display", "none")
            eye3.css("display", "none")
            eye4.css("display", "none")
            eye1.css("display", "none")
            eye5.css("display", "block")
        }
        break;
    }
})
评论
  • 何弃疗
    何弃疗 回复

    给所有图像class =“ eye”

    如果您发布了一些HTML,我可以检查我的代码

    $('.eyes').on("click",function(e){
      $(".eye").hide();
      $(".eye").eq($(this).index()).show()
    })