Jquery如何为表中的数字添加+1

时间:2011-05-12 18:26:33

标签: jquery

所以我用php / mysql生成一个表,在这个表中是行中的数字。我有一个按钮,点击后,在MySQL数据库中为此数字值添加+1。问题是,我必须刷新页面以显示在表格中显示的新号码。

我试图通过jquery按钮单击事件的成功上的函数立即显示新数字。所以基本上我需要在表格中识别HTML生成的数字,然后为其添加+1。

问题是,该表是在php中使用 while 函数生成的,因此每行都会动态获取自己的ID。

希望这一切都有意义。

到目前为止,这是我的Jquery代码。

   $('.upArrow').click(function(){
   //this is finding the uparrow button that adds +1
   var row = $(this).attr('rowid');

    $.ajax({
    type: "GET",
    url: "upArrow.php?id="+row,
    cache: false,
    async: false,
    success: function(result){
    //this is tricky part, how do I select the displayed number part of the
    // table, then Add 1?

    },
    error: function(result){
        alert('Error, please try again.');
    }
    });
});

编辑:这是我的HTML表格的一部分:

    <td id="musicDisplay" colspan="2">

    <div id="newUpArrow">
        <a href="javascript:void(0)" class = "upArrow"
        rowid="' . $row['id'] . '"><img src="../Img/upArrow.gif"/>
            </a> </div>

     <!--Here is the number I want to change.-->
    <div>'. $row['points'] . '</div>
 </td>

2 个答案:

答案 0 :(得分:0)

理论上,您需要将ajax请求的上下文设置为包含所需文本的元素。然后,在成功时,您将增加该上下文中的数字。

$.ajax({
    /* everything else as before */
    context: $('selector for element containing number to increase'),
    success: function(result) {
        $(this).html(parseInt($(this).html(), 10) + 1);
    }
});

这假设上下文元素的内容始终是一个整数

如果您需要按列和行选择单元格,则可以执行以下操作:

    var column = 1;
    var row = 1;

    var $cell = $('table tr:eq(' + row + ') td:eq(' + column + ')');

    $cell.html(parseInt($cell.html(), 10) + 1);

请参阅小提琴:http://jsfiddle.net/xixionia/4HLp9/

虽然,您需要将“table”更改为表的id,否则您最终将从的每一个表中的所有单元格中选择该行中的所有单元格。

注意:看过你的html后,我们就可以提供更详细的说明如何选择所需的单元格。

答案 1 :(得分:0)

你有几行?从AJAX调用重新生成表并重新加载html就可能有意义了。