使用 jquery 为多个动态元素设置单击事件 - Set on click event for multiple dynamic elements using jquery

Set on click event for multiple dynamic elements using jquery

我有一个动态表单，它将通过运行mysql查询来填充，以更好的方式，我有一个从mysql填充的动态表。我已经为我想在单击事件中创建的每一行放置了一个按钮，以便它获取该行的 ID 并能够将用户发送到第二页以编辑该行信息，但我在检查此多个按钮时遇到问题，如果是复选框，那就更容易了。

这是我的点击事件：

  var user_list = [];
        $('.sec_uid').each(function(i){
            user_list[i] = $(this).val();
            alert(user_list[i]);
            $(this).on('click',function () {
                var vsec_uid = $('#result_table').find('[name=sec_uid]').val();
                alert(vsec_uid);
            });
        });

这是由php和mysql创建的动态部分：

while ($users_row = mysqli_fetch_assoc($sec_users)) {
    echo "<tr>
          <td><input id='sec_user_id' name='sec_uid[]' class='sec_uid' type='hidden' value='".$users_row['id']."'/></td>
           <td>
              <input name = 'session_order' value = '" . $users_row['name'] . " " . $users_row['lastname'] . " : " . $users_row['user_role'] . "' />
            </td>
            <td>
                <button id = 'Edit_sec_user' name='edit_secUser[]' class='btn btn-default'>Edit User</button>
             </td>
              <td>"; if(isset($users_row['sign_file']) && $users_row['sign_file']!=''){ echo"<a href='" . $users_row['sign_file'] . "' target='_blank'><button type='button' class='styled_button_radius' name='sign_file'>view file</button></a>";}
            echo "</td>
            </tr>";
 }

这是 html 部分：

 <form method='post' class="form-inline">
      <div class="form-group">
         <div id="result_table">
              <!--  dynamic load -->
          </div>
        </div>
  </form>

在按钮上editBtn给出另一个类名，以便稍后引用它：

while ($users_row = mysqli_fetch_assoc($sec_users)) {
echo "<tr>
      <td><input id='sec_user_id' name='sec_uid[]' class='sec_uid' type='hidden' value='".$users_row['id']."'/></td>
       <td>
          <input name = 'session_order' value = '" . $users_row['name'] . " " . $users_row['lastname'] . " : " . $users_row['user_role'] . "' />
        </td>
        <td>                
            <button id = 'Edit_sec_user' name='edit_secUser[]' class='btn btn-default editBtn'>Edit User</button>
            <!-- --------------------------------------------------------------------- ^ HERE -->
         </td>
          <td>"; if(isset($users_row['sign_file']) && $users_row['sign_file']!=''){ echo"<a href='" . $users_row['sign_file'] . "' target='_blank'><button type='button' class='styled_button_radius' name='sign_file'>view file</button></a>";}
        echo "</td>
        </tr>";
}

而jQuery部分，需要稍微调整一下：

// use event delegation for dynamic content
$('#result_table').on('click','.editBtn', function () {
    // get current ID($users_row['id']) for
    // particular row
    var vsec_uid = $(this).closest('tr').find('.sec_uid').val();
    alert(vsec_uid);       
});