Question

我有一个页面，我有很多控件，然后我有一个div元素，并在div元素中有10个asp按钮。

我想将mousehover事件绑定到div元素内的那些按钮。

目前我这样做：

<script src="jquery-1.6.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#MangoPager_btn1").hover(mousehoverfunction);
            $("#MangoPager_btn2").hover(mousehoverfunction);
            $("#MangoPager_btn3").hover(mousehoverfunction);
            $("#MangoPager_btn4").hover(mousehoverfunction);
            $("#MangoPager_btn5").hover(mousehoverfunction);
            $("#MangoPager_btn6").hover(mousehoverfunction);
            $("#MangoPager_btn7").hover(mousehoverfunction);
            $("#MangoPager_btn8").hover(mousehoverfunction);
            $("#MangoPager_btn9").hover(mousehoverfunction);
            $("#MangoPager_btn10").hover(mousehoverfunction);
        }); 
</script>

在jquery中是否存在任何方式，以便我可以声明类似[MangoPager_btn10,MangoPager_btn2,MangoPager_btn3]的按钮ID列表，这样我就不必为每个按钮ID执行此操作。

我尝试使用input类型但是它将所有输入类型对象的函数应用于div elemet中的按钮。

任何其他更好的方式在jquery中执行.... 我

Answer 1

试试这个：

$(function(){
  $("[id^='MangoPager_btn']").hover(mousehoverfunction);
})

Answer 2

$('#DivElementId input').hover(mousehoverfunction);

Answer 3

您可以简单地为所需的输入提供一个类：

$(".mouse-over").hover(mousehoverfunction);

或者如果您只有几个ID：

$("#MangoPager_btn1, #MangoPager_btn2, #MangoPager_btn3").hover(mousehoverfunction);

Answer 4

$（“＃MangoPager button”）。悬停（mousehoverfunction）;

将函数绑定到父div，然后将所有按钮绑定到这样。假设MagoPager是父div的id。

或

$（“＃MangoPager input [type =]”）。hover（mousehoverfunction）;

Answer 5

尝试这样的事情：

$(".containerclass input[type=submit]").hover(mousehoverfunction);

这会将函数绑定到容器内的所有按钮（css）class =“containerclass”

Answer 6

我建议使用委托：http://api.jquery.com/delegate/，因为它会为所有元素的一个或多个事件附加处理程序

Answer 7

在这种情况下，我使用带有regexp的过滤器http://api.jquery.com/filter/

$("input").filter(function()
{
return /MangoPager_btn/.test(this.id)
}).hover(mousehoverfunction);

在jquery中绑定事件的更好方法

7 个答案: