处理数据表行内的事件答案

【问题标题】：handle events inside datatable row处理数据表行内的事件
【发布时间】：2018-01-17 00:00:53
【问题描述】：

我对@987654321@ 中的事件有疑问。

我有一个表格，在几列中，我有锚标签，例如：

<tr role="row" class="odd">
  <td class="sorting_1">1</td>
  <td>4.000,00</td>
  <td>
    <a class="js-details" id="9">
      <p class="blue-text">Ver detalle</p>
    </a>
  </td>
  <td>04/09/2017</td>
  <td>
    <a class="icon-checkmark"></a>
    <a class="icon-x red-text js-payment-rejected" href="#" id="9" title="Rechazar el Pago"></a>
  </td>
</tr>

我有这些功能：

$('.js-payment-approved').click ->
  payment_document_id = $(this).attr('id')
  $.get("#{approved_payment_documents_path}", payment_document_id: payment_document_id)

$('.js-payment-rejected').click ->
  payment_document_id = $(this).attr('id')
  $.get("#{rejected_payment_payment_documents_path}", payment_document_id: payment_document_id)

如果我点击事件不会触发的任何锚标记，我在数据表论坛上读到我应该执行this 之类的操作：

$('.approved-datatable').on 'tr', 'click',  (e) ->
  $('.js-payment-rejected').click ->
    payment_document_id = $(this).attr('id')
    $.get("#{rejected_payment_payment_documents_path}", payment_document_id: payment_document_id)

但如果我这样做，我必须点击两次表格才能触发事件。

任何想法如何解决这个问题？

【问题讨论】：

标签： javascript jquery coffeescript

【解决方案1】：

on 方法是一个事件处理程序，您可以将其绑定到您感兴趣的事件，因此您无需在处理程序内调用.click 方法。这应该足够了：

$('.approved-datatable').on 'click', '.js-payment-rejected', (e) ->
  payment_document_id = $(this).attr('id')
  $.get("#{rejected_payment_payment_documents_path}", payment_document_id: payment_document_id)

注意 jQuery on 需要事件作为第一个参数，而第二个是选择器。供参考jQuery API

【讨论】：