та же функция для двух кнопок в jQuery

у меня есть две кнопки: btnAdd и btnUpdate. Я написал функцию jquery для button btnUpdate для проверки некоторых полей на веб-странице, например:

$(function() {

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

Я хочу сделать то же самое, когда btnAdd кнопки. Поэтому я должен снова написать ту же функцию для btnAdd. Есть ли другой способ избежать этого?

(если я пишу одну функцию javascript и вызываю ту же функцию в событии нажатия кнопки обеих кнопок, все в порядке. Но есть ли способ использовать в jQuery?)

4 ответов


просто сделать выбор из двух кнопок, разделенных запятой: ("#add, #update").click... Выглядит так в вашем коде:

$(function() { 

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

есть два способа.

(1) Выберите оба элемента сразу и примените к ним обработчик событий:

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

(2) Дайте функции имя, а не оставлять анонимные:

function clickHandler() {
  // code here
}

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

мы называем это рефакторинг и это то, что поможет вам на всем пути, подробнее о, инвестируйте в себя и купить фантастический один и только рефакторинг книги

в вашем случае, вы должны сделать это:

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

jQuery-это фреймворк JavaScript, а не другой язык, поэтому вы можете написать здесь одну функцию JavaScript.

function validateFields(e) {
    code here;
}

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