Слушатель событий для события нажатия на нескольких кнопках же именем, но разным значением

Question

EDITED ИСПРАВЛЕНО И ОБРАБОТКА: Jquery и самозагрузки не позволяют одинаковый идентификатор - см новый пользовательский интерфейс и Jquery код ниже:

Раньше пытались полностью отделено onclick события из пользовательского интерфейса, как рекомендовано в последней практике безопасности. Использование повторного идентификатора в JQuery и Javascript создает плохое mojo для событий onclick даже с использованием «this» - вместо этого используйте цепочный класс (пустой класс) за классами начальной загрузки Twitter и привяжите onclick к новому пользовательскому классу. Это устраняет событие on-line on-click.

ОБНОВЛЕНО код UI:

//Grid Row 1 with record info preceeding 
<td> 
<button type='button' class='btn btn-default btn-xs cust_delete' id='btn_delete_record_1' name='btn_delete_record_1' value="X38-721" data-toggle='modal' data-target='#DeleteRecordModal'> 
<span class='glyphicon glyphicon-trash'></span> 
</button> 
</td> 

//Grid Row 2 with record info preceeding 
<td> 
<button type='button' class='btn btn-default btn-xs cust_delete' id='btn_delete_record_2' name='btn_delete_record_2' value="X34-7245" data-toggle='modal' data-target='#DeleteRecordModal'> 
<span class='glyphicon glyphicon-trash'></span> 
</button> 
</td> 

Jquery -

$(document).ready(function() { 
    $('.cust_view').click(function() { 
     var myRecord = $(this).attr('value'); 
     $("#view_record_id").val(myRecord); 
     $('form#frm_view_record').submit(); 
    }); 
    $('.cust_delete').click(function() { 
     var myRecord = $(this).attr('value'); 
     $('#delete_record_id').val(myRecord); 
    }); 
}); 

Answer 1

Использование document.querySelectorAll() перебрать все вхождения кнопки с именем "кнопки" и addEventListener() с к ним. Кнопки могут иметь разные значения, но он проверяет только имя:

var linkListener = document.querySelectorAll("button[name='button']"); 
 

 
for (i=0;i<linkListener.length;i++){ 
 
    linkListener[i].addEventListener("click", linkFunction); 
 
    } 
 

 
function linkFunction(){ 
 
    
 
    alert("You clicked a button with a \"name\" of \"button\"."); 
 
    
 
    }

<button name="button">A button</button><button name="button">A button</button><button name="button">A button</button><button name="button">A button</button><button name="button">A button</button><button name="button">A button</button><button name="button">A button</button><br/><br/> 
 

 
<button name="button1">A button</button><button name="button2">A button</button><button name="button3">A button</button><button name="button4">A button</button><button name="button5">A button</button><button name="button6">A button</button><button name="button7">A button</button>