jQuery中两个按钮的相同功能答案

【问题标题】：same function for two buttons in jQueryjQuery中两个按钮的相同功能
【发布时间】：2011-04-18 03:58:56
【问题描述】：

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

$(function() {

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

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

（如果我写一个javascript函数并在两个按钮的按钮单击事件中调用相同的函数，那很好。但是有什么办法使用jQuery？）

【问题讨论】：

标签： javascript jquery buttonclick

【解决方案1】：

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

$(function() { 

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

【讨论】：

你应该提到重构是开发中的一大步。

【解决方案2】：

有两种方法。

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

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

(2) 给函数起个名字，而不是匿名：

function clickHandler() {
  // code here
}

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

【讨论】：

【解决方案3】：

我们称之为 Refactoring，它会一路帮助您，了解更多信息，投资自己并购买独一无二的梦幻般的 @987654322 @

在你的情况下，你应该这样做：

$(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);
}

【讨论】：

【解决方案4】：

jQuery 是一个 JavaScript 框架，而不是另一种语言，所以你也可以在这里编写一个 JavaScript 函数。

function validateFields(e) {
    code here;
}

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

【讨论】：