Как использовать событие click для тега привязки и тега кнопки одновременного ввода в jQuery?

Question

Я использую jQuery 1.9.1 в моем проекте. Я следующий HTML:

<button type="button" id="btn_add" class="btn btn-primary">Add</button> 
<a class="btn_delete" href="#"><i class="icon-trash"></i></a> 

Я хочу, чтобы отобразить тот же предупредительное сообщение, если пользователь нажимает на значок, заключенный в тег якоря с классом «btn_delete» или нажмите на кнопку, имеющий идентификатор «btn_add».

Для этого я пробовал следующий код, но для меня это не сработало.

$(document).ready(function() { 
    $("button#btn_add.btn_delete").on("click", function(event) { 
    event.preventDefault(); 
    alert("This action has been temporarily disabled!") 
    }); 
}); 

Может кто-то, пожалуйста, помогите мне в этом отношении, пожалуйста?

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

Заранее спасибо.

Answer 1

**Approach #1** 
    function doSomething(){ 
    //your code 
    } 

    $('#btn_add').click(doSomething); 
    $('.btn_delete').click(doSomething); 

    **Approach #2** 
    $("#btn_add,a.btn_delete").on("click", function(event) { 
     event.preventDefault(); 
     alert("This action has been temporarily disabled!") 
    }); 

Answer 2

Ваш код довольно близок к тому, каким он должен быть. Изменение:

$("button#btn_add.btn_delete") 

To:

$("#btn_add,a.btn_delete") 

Answer 3

Вы можете использовать , иметь несколько селекторов.

$(".btn_delete i,#btn_add").on("click", function(event) { 
    event.preventDefault(); 
    alert("This action has been temporarily disabled!") 
}); 

Answer 4

Вы можете иметь как тег HTML в селекторе JQuery, как показано ниже:

$(document).ready(function() { 
    $("button#btn_add, a.btn_delete").on("click", function(event) { 
    event.preventDefault(); 
    alert("This action has been temporarily disabled!") 
    }); 
}); 

Надеется, что это помогает!

Answer 5

$(document).ready(function() { 
    $("#btn_add,.btn_delete").on("click", function(event) { 
     event.preventDefault(); 
     alert("This action has been temporarily disabled!") 
    }); 
}); 

Answer 6

Дополнительно к другим ответам:

Ваш текущий селектор будет найти элементы, как это:

<button id="btn_add" class="btn_delete">Foo</button> 

Answer 7

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script> 

$(document).ready(function() { 
$("button#btn_add, a.btn_delete").on("click", function(event) { 
event.preventDefault(); 
    alert("This action has been temporarily disabled!") 
}); 
}); 

</script>