javascript - 使用 jquery 选择器浏览所有图像

Question

当 mousemove 事件启动时，我使用此代码显示一个链接

$('#articlesdata\\:0\\:article-image').mousemove(function(){
                $('#articlesdata\\:0\\:article-suppr').show();
            });

我想将此代码应用于所有图像，我的意思是：等等articlesdata\\:0\\:article-image： 所有整数articlesdata\\:1\\:article-imagearticlesdata\\:2\\:article-image

我怎样才能做到这一点

谢谢你

Answer 1

使用属性选择器^

这会选择一个值正好以给定字符串开头的 id。

尝试这个

$([id^='articlesdata']).mousemove(function(){
   .....

Answer 2

选择它们的最好方法是给它们一个通用的类。

<img class="article-image" id="articlesdata:0:article-image" src="foo1.jpg">

然后按类别选择：

$(".article-image").mouseenter(function(){
    $("#" + this.id.replace('image','suppr')).show();
}).mouseleave(function(){
    $("#" + this.id.replace('image','suppr')).hide();
});

或使用您的原始代码：

$(".article-image").mousemove(function(){
    $("#" + this.id.replace('image','suppr')).show();
})

Answer 3

articlesdata\\:0\\:article-image假设您的图像具有类似or的 id articlesdata:0:article-image，您可能会执行以下操作：

$('img').mousemove(function(){
     if (/article-image$/.test(this.id)) {
         $(document.getElementById(this.id.replace(/-image$/, '-suppr'))).show();
     }
});

但是mousemove，我建议使用mouseenter.

示范