如何使用JQuery将增量（1）添加到元素的值

Question

<span id="shortfall" style="color:black">$row[shortfall]</span> 

如何使用JQuery将$ row [shortfall]增加到$ row [shortfall] +1？

Answer 1

您需要parseInt处理字符串的数字。

$("#shortfall").text(parseInt($("#shortfall").text()) + 1); 

Answer 2

当它到达浏览器时，您的表达式将被评估并转换为数字。要使用jQuery，您只需获取跨度的文本值，将其转换为数字，然后替换文本值即可。在添加之前，您需要将该值转换为数字，否则将执行字符串连接。

$("#shortfall").each(function() { 
    $(this).text(Number($(this).text()) + 1); 
}); 

更新：我使用的每一个向您展示如何使用一个通用的选择可能会接受输入的收集做到这一点。在你的情况下，如果你知道它恰好匹配一个元素，那么如果你希望代码应用到多个元素上，你可能需要重写它来优化它。

var span = $("#shortfall"); 
span.text(Number(span.text()) + 1); 

更新：需要使用的文本（）（或HTML（）），因为元件是SPAN，不是输入。

Answer 3

$(document).ready(function(){ 
 
    $("#increment").click(function(){ 
 
    $(".sl-no").html(function(){ 
 
     $(this).html(parseInt($(this).html())+1); 
 
    }); 
 
    }); 
 
});

table { 
 
    font-family: arial, sans-serif; 
 
    border-collapse: collapse; 
 
    width: 100%; 
 
} 
 

 
td, th { 
 
    border: 1px solid #dddddd; 
 
    text-align: left; 
 
    padding: 8px; 
 
} 
 

 
tr:nth-child(even) { 
 
    background-color: #dddddd; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <button id='increment'>Click to Increment</button> 
 
<table> 
 
    <tr> 
 
    <th>Sl</th> 
 
    <th>Company</th> 
 
    <th>Contact</th> 
 
    <th>Country</th> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>1</td> 
 
    <td>Alfreds Futterkiste</td> 
 
    <td>Maria Anders</td> 
 
    <td>Germany</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>2</td> 
 
    <td>Centro comercial Moctezuma</td> 
 
    <td>Francisco Chang</td> 
 
    <td>Mexico</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>3</td> 
 
    <td>Ernst Handel</td> 
 
    <td>Roland Mendel</td> 
 
    <td>Austria</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>4</td> 
 
    <td>Island Trading</td> 
 
    <td>Helen Bennett</td> 
 
    <td>UK</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>5</td> 
 
    <td>Laughing Bacchus Winecellars</td> 
 
    <td>Yoshi Tannamuri</td> 
 
    <td>Canada</td> 
 
    </tr> 
 
    <tr> 
 
    <td class='sl-no'>6</td> 
 
    <td>Magazzini Alimentari Riuniti</td> 
 
    <td>Giovanni Rovelli</td> 
 
    <td>Italy</td> 
 
    </tr> 
 
</table>