Jquery处理表中的按钮

时间:2014-10-10 17:11:13

标签: php jquery ajax html5

我还没有找到一个合理的答案。

我有一个表格正在显示,表格中每行的末尾是一个用于加入游戏的按钮。

按钮只是

<td><button class="btn-u btn-u-xs rounded-2x btn-u-default" id="<?php echo $game['id']; ?>"type="button">Join League</button></td>

每个按钮ID是用户加入的游戏行的ID。因此,当用户单击该行的按钮时,我需要jquery来运行帖子以将用户保存在游戏中

我有后端PHP代码完成实际保存用户但我不知道如何jquery发送带有按钮ID的帖子

2 个答案:

答案 0 :(得分:0)

在按钮中添加一个类,它们在jQuery中用作选择器。我给了他们所有的联盟联赛。然后在这些按钮上侦听click事件。您可以获取游戏ID并使用它来提交表单或进行ajax调用,以便用户保存在该游戏中。

HTML

<td><button class="btn-u btn-u-xs rounded-2x btn-u-default join-league" id="<?php echo $game['id']; ?>"type="button">Join League</button></td>

JS

$('.join-league').on('click', function(e) {
    e.preventDefault();
    e.stopPropagation();

    var gameId = $(this).attr('id');
    ... do stuff, submit form or make ajax call
});

http://jsfiddle.net/ouomkk1k/ JSFiddle示例

答案 1 :(得分:0)

您可以做的是为所有按钮提供类似“save-user”的类名。然后,使用jQuery通过类将一个监听器附加到它们,并使用$(this).attr('id')访问它们的个人ID。

示例:

HTML

<table>
    <tr>
        <td><button class="button" id="1">B1</button></td>
        <td><button class="button" id="2">B2</button></td>
        <td><button class="button" id="3">B3</button></td>
        <td><button class="button" id="4">B4</button></td>
        <td><button class="button" id="5">B5</button></td>
    </tr>
</table>

JS

$(document).ready(function(){
    $('.button').on('click', function(){
       alert($(this).attr('id')); 
    });
});

JSFiddle示例here