jQuery中两个按钮的相同功能

Question

我有两个按钮:btnAdd和btnUpdate.我为按钮编写了一个jquery函数btnUpdate来验证网页中的某些字段,如:

$(function() {

  $('#<%=btnUpdate.ClientID %>').click(function() {
    code here
    });
});

btnAdd单击时我想做同样的事情.所以我必须为btnAdd再次编写相同的函数.还有其他方法可以避免这种情况吗？

(如果我编写一个javascript函数并在两个按钮的按钮单击事件中调用相同的函数,那很好.但有没有办法使用jQuery？)

Answer 1

只需选择两个按钮,用逗号分隔: ("#add, #update").click... 在您的代码中看起来像这样:

$(function() { 

  $('#<%=btnUpdate.ClientID %>, #<%=btnAdd.ClientID %>').click(function() { 
    code here 
    }); 
}); 

Answer 2

有两种方法.

(1)一次选择两个元素并将事件处理程序应用于它们:

$(function() {
    $('#<%=btnUpdate.ClientID %>, #<%=btnAdd.ClientID %>').click(function() {
        code here
    });
});

(2)给函数命名,而不是匿名:

function clickHandler() {
  // code here
}

$('#<%=btnUpdate.ClientID %>, #<%=btnAdd.ClientID %>').click(clickHandler);

Answer 3

我们将此称为重构,它可以帮助您,阅读更多信息,投资自己并购买精彩的重构书.

在你的情况下,你应该这样做:

$(function() {

  $('#<%=btnUpdate.ClientID %>').click(function() {
        validate($this);
    });
  $('#<%=btnAdd.ClientID %>').click(function() {
        validate($this);
    });    

});

function validate(myButton)
{
    // code here
}

正如你应该做的那样.

但是作为jQuery,你可以拥有多个输入的选择器,所以你需要做的就是:

$('#<%=btnUpdate.ClientID %>, #<%=btnAdd.ClientID %>').click(function() { 
    validate($this);
}