如何在jQuery中綁定同一個事件上的多個id？

這裏是我的HTML代碼：如何在jQuery中綁定同一個事件上的多個id？

<a style='cursor:pointer' id='anchor1' onmouseover=fnover(this)> 
<a style='cursor:pointer' id='anchor2' onmouseover=fnover(this)> 
<a style='cursor:pointer' id='anchor3' onmouseover=fnover(this)>

這裏是我的JavaScript代碼：

fnover(obj){ 
    $('.dropdown').fadeIn(); 
}

我的要求是，我有多個ID，但我想動態使用jQuery綁定ID。每當您將鼠標懸停在錨標記上時，該特定錨標記將爲淡入或淡出。

有什麼建議嗎？

來源

2013-11-21 Kalyan

使用單一類，而不是幾個ID的？ –

在我上面的代碼。如果我只有一個錨點的鼠標懸停，它會顯示所有fadein ..如何解決此問題... – Kalyan

$('#id1,#id2,#id3').on('mouseenter',function(){ 
    //do stuff on mouse over 
}); 
$('#id1,#id2,#id3').on('mouseleave',function(){ 
    //do stuff on mouse out 
});

當然更容易，如果你只是給你一個項目類，而不是一個獨立的ID，因爲他們似乎做同樣的事情...

$('.myclass').on('mouseleave',function(){ 
    //do stuff on mouse out 
});

來源

2013-11-21 10:30:31 rita

但OP想要動態綁定ID。 –

爲什麼不類添加到每個HTML元素並使用getElementByClass（）函數選擇要使用fadeIn（）和fadeOut（）的元素。

來源

2013-11-21 10:30:40 J2D8T

您可以通過多種選擇，以逗號分隔像

$("#anchor1, #anchor2, #anchor3").mouseover(function() { 
    $('.dropdown').fadeIn(); 
});

來源

2013-11-21 10:30:47 Satpal

試試這個：

onmouseover=fnover($(this).attr("id"))

來源

2013-11-21 10:30:49

你的意思是這樣的

<a style='cursor:pointer' id='anchor1' /> 
<a style='cursor:pointer' id='anchor2' /> 
<a style='cursor:pointer' id='anchor3' />

，然後綁定相同的功能到所有三個錨點

$('#anchor1, #anchor2, #anchor3').hover(function(){ //Select all three 
    $('.dropdown').fadeIn();      //On mouse over 
}, function(){ 
    $('.dropdown').fadeOut();      //on mouse out 
});

，儘管代碼會給予你希望這個功能附加到像aFade一個類中的所有錨標籤，然後使用

$('.aFade').hover(function.........

來源

2013-11-21 10:31:03

選擇它們更好的寫法你可以，如果你做一些這樣的事有錨標籤ID的

$(function(){ 
    $("a[id*=anchor]").mouseover(function(){ 
     //do your stuff here 
    }); 
});

以上腳本的一些常見的名字是：如果任何錨標籤的ID與anchor開始，那麼該事件將進行佈線。您甚至不必指定錨標記的所有ID。

它也更好，如果你有一些共同的.classname您的錨標籤。所以只有那些特定的類名才能將事件連接起來。

這裏是fiddle

希望它可以幫助

來源

2013-11-21 10:34:29

如何在jQuery中綁定同一個事件上的多個id？

回答

相關問題