что правильнее: куча .on() или куча hasClass()?
есть кнопки: "добавить", "изменить", "удалить".
<button class="add action" type="button">+</button> <button class="edit action" type="button">/</button> <button class="del action" type="button">-</button> при нажатии обрабатываются параметры, после чего запрос в базу. как правильнее: привязать on на все кнопки: .on("click", "button.add", function(event) { ... }) .on("click", "button.edit", function(event) { ... }) .on("click", "button.del", function(event) { ... }) .on("click", "button.action", function(event) { ajax(...); }) или один .on и куча hasClass: .on("click", "button.action", function(event) { o_this = $(this); if (o_this.hasClass("add")) { ... } if (o_this.hasClass("edit")) { ... } if (o_this.hasClass("del")) { ... } ajax(...); }) ? может есть более интеллигентное решение для такой задачи? спасибо! |
<div id="action"> <button class="add" type="button">+</button> <button class="edit" type="button">/</button> <button class="del" type="button">-</button> </div> $("#action").on("click", "button", function(){ alert(this.className); }); Так лучше будет |
у меня именем класса определяется какие именно параметры и как собирать. в кнопке бывает 1-2 класса для этого и 1-2 класса для CSS.
|
Цитата:
|
Я бы сделал три варианта на клик трех разных кнопок. В каждом сначала собрал данные для ajax запроса(или определил отдельную функцию, если код повторяется), а затем вызвал определенную функцию с этими параметрами, которая делает ajax запрос.
.on("click", "button.add", function(event) { // сбор данных ... sendAjax(param); }) .on("click", "button.edit", function(event) { // сбор данных ... sendAjax(param); }) .on("click", "button.del", function(event) { // сбор данных ... sendAjax(param); }) function sendAjax(param){ ... } |
так почти и сделано.
вопрос в том, что оптимальнее: вешать несколько делегированных обработчиков, ждущих всё время появления и нажатия подходящих кнопок, или один обработчик, а внутри разрулить hasClassами? |
Часовой пояс GMT +3, время: 06:21. |